/* New common styles */
:root {
--font-text-regular: "Inter", serif;
--font-text-medium: "Inter", serif;
--font-display-regular: "Inter", serif;
--font-display-medium: "Inter", serif;
--color-white: #ffffff;
--color-athens-gray-darker: #D6DBDD;
--color-background-main: #F3F4F6;
--color-dawn-pink: #FAF6F4;
--color-gallery-darker: #EAEAEA;
--color-mischka: #EBEAEC;
--color-black: #000000;
--color-navy: #161b4e;
--color-bread-first: #1D1D1F;
--color-bread: #AD8B56;
--color-category-heading: #030136;
--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;
}
.fs-clamp { font-size: 16px;}
.fs-clamp h1, .fs-clamp h2, .fs-clamp h3, .fs-clamp h3 a, .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)}
}
/*@media (min-width:768px) {*/
/* .fs-clamp .fs-h1-mobile { font-size: inherit; line-height: inherit;letter-spacing: inherit}*/
/*}*/
@media (min-width:1024px){
.fs-clamp h1, .fs-clamp .fs-h1{ letter-spacing: -0.4px}
.fs-clamp h2, .fs-clamp .fs-h2{ letter-spacing: -0.32px}
}
/* general */
.grid-container:has(.ls-redesign),
.grid-container-lg:has(.ls-redesign) {
max-width: 100%;
padding-left: 24px;
padding-right: 24px;
margin: 0;
}
.ls-redesign {
max-width: 1600px;
margin-left: auto;
margin-right: auto;
margin-bottom: 48px;
padding: 0;
}
.ls-redesign img {
max-width: 100%;
}
.product-listing-breadcrumbs {
padding-left: 24px;
padding-right: 24px;
}
.ls-redesign.ls-no-mt {
margin-top: 0;
}
.ls-redesign.ls-no-mb {
margin-bottom: 0;
}
.catalog-category-view .grid-container.main {
margin-top: 0;
}
/* for Google Maps' little orange man icon to show */
.gm-style img {
max-width: none;
}
.dynamic-sizes > div + div,
.main-spacetop {
margin-top: clamp(48px, 5vw, 64px);
}
.force-original-hub-spacing,
.dynamic-sizes > div + div.force-original-hub-spacing {
margin-top: clamp(48px, 5vw, 64px) !important; /* needs important to overwrite comparison table's margin-top on some pages */
}
.columns-nomargin .columns {
margin: 0;
}
.dynamic-sizes > .ls-breadcrumbs ~ .intro,
.ls-intro-mt {
margin-top: clamp(32px, 5vw, 80px);
}
.dynamic-sizes.ls-category-page > div + div.columns {
margin-top: 0px;
}
.dynamic-sizes h1 {
letter-spacing: -0.1px;
}
.dynamic-sizes h2 {
letter-spacing: -0.1px;
margin-bottom: clamp(16px, 1.5vw, 18px);
}
.dynamic-sizes h2.bigger-mb-desktop {
margin-bottom: clamp(16px, 2.5vw, 32px);
}
.showroom-page h2,
.dynamic-sizes.showroom-page h2 {
margin-bottom: clamp(8px, 1.5vw, 18px);
}
.showroom-page .showroom-products h2,
.dynamic-sizes.showroom-page .showroom-products h2 {
margin-bottom: clamp(8px, 2.5vw, 32px);
}
.dynamic-sizes .subheading-style,
.subheading-style {
font-family: var(--font-text-medium);
font-size: clamp(16px, 2vw, 32px);
line-height: 24px;
letter-spacing: -0.08px;
color: var(--color-black);
}
.dynamic-sizes p,
.dynamic-sizes .remove-main-btn-styles {
font-family: var(--font-text-regular);
letter-spacing: -0.06px;
}
.dynamic-sizes .remove-main-btn-styles {
line-height: clamp(20px, 1.5vw, 24px);
}
.dynamic-sizes .swatch.remove-main-btn-styles {
font-family: var(--font-text-medium);
}
.dynamic-sizes .products-grid__filters-buttons .remove-main-btn-styles {
font-size: 16px;
line-height: 20px;
font-weight: 500;
letter-spacing: -0.4px;
height: 46px;
width: 145px;
display: flex;
align-items: center;
justify-content: center;
color: var(--color-black);
border: 1px solid #C4CCCE;
border-bottom: 4px solid #C09A5F;
text-decoration: none;
}
.dynamic-sizes .products-grid__filters-buttons #filterDoButton {
border-bottom: none;
background-color: #AD8B56;
color: var(--color-white);
}
.dynamic-sizes .products-grid__filters-buttons #filterDoButton span {
content: "";
display: inline-block;
width: clamp(7px, 2vw, 10px);
height: clamp(8px, 2vw, 9px);
background: url("/media/skin/icons/chevron_left_orange.svg") no-repeat 50% 50%;
background-size: 100%;
transform: rotate(180deg);
}
.dynamic-sizes p {
color: var(--color-emperor);
}
.dynamic-sizes p + p {
margin-top: clamp(1.333333333333333em, 1.5vw, 1.5em);
}
.dynamic-sizes strong {
font-family: var(--font-text-medium);
color: var(--color-black);
}
.bgcolor-grey {
background-color: var(--color-background-main);
}
.bgcolor-dawn-pink {
background-color: var(--color-dawn-pink);
}
.big-text,
.dynamic-sizes .big-text {
font-family: var(--font-text-regular);
font-size: clamp(20px, 2vw, 32px);
line-height: clamp(28px, 2.5vw, 40px);
letter-spacing: -0.1px;
}
.big-text strong,
.fs-clamp p.big-text strong {
font-family: var(--font-text-medium);
}
.meta-text {
font-size: 12px;
line-height: 20px;
letter-spacing: -0.06px;
color: var(--color-emperor);
}
.current-location {
display: flex;
align-items: center;
gap: 8px;
margin-top: 8px;
cursor: pointer;
}
/* container goes to the edge of window */
.content-offset {
margin-right: -24px;
}
/* container goes to the edge of window both side */
.content-offset-bothside {
margin-left: -24px;
margin-right: -24px;
}
.content-offset-bothside > div {
max-width: 1600px;
margin-left: auto;
margin-right: auto;
}
.no-arrowsonmobile .swiper-button-next,
.no-arrowsonmobile .swiper-button-prev {
display: none;
}
.with-videolink {
display: block;
position: relative;
}
.with-videolink::before {
content: "";
display: block;
width: clamp(73px, 7.5vw, 120px);
height: clamp(73px, 7.5vw, 120px);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 100;
background: url("/media/skin/environment/hub_play.svg") no-repeat 50% 50%;
background-size: cover;
}
.text-block .cta-button {
margin-top: clamp(16px, 2.5vw, 24px);
}
.ls-redesign p a {
color: var(--color-emperor);
text-decoration: underline;
transition: color 0.3s ease-in-out;
}
.ls-redesign p a:hover,
.ls-redesign p a:focus {
color: var(--color-black);
}
.ls-redesign p a,
.ls-redesign p a:hover,
.ls-redesign p a:focus {
border-bottom: 0;
}
.ls-redesign p a.no-hover-effect,
.ls-redesign p a.no-hover-effect:hover,
.ls-redesign p a.no-hover-effect:focus {
color: var(--color-black);
}
.product-listing-page-top ~ .columns .main {
margin-top: 0;
}
.select-box.display-always {
max-width: 100%;
display: flex;
margin: 0;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.select-box.display-always .option,
.select-box.display-always .options-container ~ .selected {
font-size: clamp(12px,1vw,16px);
line-height: 24px;
color: var(--color-black);
font-weight: 400;
}
.selected > span {
font-family: var(--font-text-regular);
}
/* end general */
/* main menu */
.has-banner-img .banner-img-container {
display: none;
}
/* end main menu */
/* call to action button */
.cta-button {
display: inline-block;
padding: 8px 16px;
background: var(--color-cheshire);
}
.cta-button,
a.cta-button {
font-family: var(--font-text-regular);
color: var(--color-white);
text-decoration: none;
}
.cta-button span {
line-height: 1;
}
/* end call to action button */
/* breadcrumbs */
.ls-breadcrumbs {
display: flex;
align-items: center;
}
.ls-breadcrumbs a.breadcrumbs-home {
flex-shrink: 0;
}
.ls-breadcrumbs a.breadcrumbs-home,
.ls-breadcrumbs a.breadcrumbs-home img,
.ls-breadcrumbs > span,
.ls-breadcrumbs > span img {
display: block;
}
.ls-breadcrumbs a:not(.breadcrumbs-home) {
font-family: var(--font-text-regular);
font-size: 10px;
line-height: 16px;
letter-spacing: 2px;
color: var(--color-bread-first);
text-transform: uppercase;
text-decoration: none;
transition: color 0.3s ease-in-out;
}
.ls-breadcrumbs a:not(.breadcrumbs-home):last-child{
color: var(--color-bread);
}
.ls-breadcrumbs a:not(.breadcrumbs-home)[href]:hover,
.ls-breadcrumbs a:not(.breadcrumbs-home)[href]:focus {
color: var(--color-shark-lighter);
}
.ls-breadcrumbs > span {
margin: 0 16px;
}
.ls-breadcrumbs>span::after {
content: "\002F";
}
.ls-breadcrumbs > span img {
display: none;
}
.breadcrumbs ul li{
color: var(--color-cheshire);
font-family: var(--font-text-regular);
font-size: 10px;
line-height: 1.6;
text-transform: uppercase;
}
.ls-breadcrumbs a, .breadcrumbs ul li:has(a){
color: var(--color-emperor);
}
/* end breadcrumbs */
/* banner slider */
.ls-slider picture {
position: relative;
display: inline-block;
}
.ls-slider picture,
.ls-slider picture img {
aspect-ratio: 16 / 9;
}
.ls-slider .swiper-initialized picture {
display: block;
}
.ls-slider.ls-banner picture {
aspect-ratio: 360 / 196;
}
.ls-slider .swiper-initialized picture img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
aspect-ratio: auto;
}
.ls-slider:not(.pagination-outside) .swiper-pagination {
bottom: 1em;
}
.ls-slider .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
width: 0.75em;
height: 0.75em;
background-color: var(--color-gallery-darker);
border-color: var(--color-gallery-darker);
opacity: 1;
}
.ls-slider .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {
background-color: var(--color-cheshire);
border-color: var(--color-cheshire);
}
.ls-slider .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.ls-slider .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}
.ls-slider .swiper-button-next,
.ls-slider .swiper-button-prev {
width: 24px;
height: 24px;
margin-top: 0;
top: 50%;
transform: translateY(-50%);
z-index: 500;
background: url("/media/skin/icons/hub_chevron_right_white.svg") no-repeat 50% 50%;
background-size: 100%;
opacity: 1;
}
.ls-slider .swiper-button-next.swiper-button-disabled,
.ls-slider .swiper-button-prev.swiper-button-disabled {
opacity: 0.65;
}
@media (hover: hover) {
.ls-slider .swiper-button-prev:hover,
.ls-slider .swiper-button-next:hover {
background: url("/media/skin/environment/hub_chevron_right_black.svg") no-repeat 50% 50%;
background-size: contain;
}
}
.ls-slider .swiper-button-prev {
left: 1em;
transform: translateY(-50%) scaleX(-1);
}
.ls-slider .swiper-button-next {
right: 1em;
}
.ls-slider .swiper-button-next::after,
.ls-slider .swiper-button-prev::after {
font-size: 0;
}
.ls-banner .swiper-button-next:not(.swiper-button-disabled),
.ls-banner .swiper-button-prev:not(.swiper-button-disabled) {
opacity: 0.75;
background: url("/media/skin/icons/hub_chevron_right_white.svg") no-repeat 50% 50%;
background-size: 100%;
}
.ls-banner .swiper-button-next:not(.swiper-button-disabled):hover,
.ls-banner .swiper-button-prev:not(.swiper-button-disabled):hover {
opacity: 1;
background: url("/media/skin/icons/hub_chevron_right_white.svg") no-repeat 50% 50%;
background-size: 100%;
}
.ls-slider.ls-banner li::before,
.ls-slider.ls-banner li::after {
content: "";
display: block;
width: 20%;
height: 100%;
position: absolute;
top: 0;
z-index: 1;
opacity: 0.25;
pointer-events: none;
}
.ls-slider.ls-banner li::before {
left: 0;
background: linear-gradient(to left, transparent 0%, black 100%);
}
.ls-slider.ls-banner li::after {
right: 0;
background: linear-gradient(to right, transparent 0%, black 100%);
}
/* end banner slider */
/* search block/form */
.search-block {
display: flex;
align-items: center;
}
.search-block input,
.search-block button {
font-family: var(--font-text-regular);
font-size: 16px;
line-height: 24px;
letter-spacing: -0.08px;
}
.search-block input {
width: 233px;
color: var(--color-emperor) !important;
padding: 7px 8px !important;
background-color: var(--color-background-main);
border: 0.5px solid var(--color-cheshire) !important;
border-radius: 0 !important;
transition: all 0.3s ease;
}
.search-block input:hover,
.search-block input:focus {
border: 0.5px solid var(--color-dark-orange) !important;
}
.search-block button {
min-width: 123.5px; /* needs this to prevent width grow when text changes to 'Searching...' */
color: var(--color-white);
padding: 7px 16px;
background-color: var(--color-cheshire);
border: 0.5px solid var(--color-cheshire);
margin-top: 0;
text-transform: none;
transition: all 0.3s ease;
text-align: left;
}
.search-block button:hover,
.search-block button:active {
background-color: var(--color-dark-orange);
border: 0.5px solid var(--color-dark-orange);
}
/* end search block/form */
/* -------------------------- */
/* ----- Showroom pages ----- */
/* -------------------------- */
/* heading with text block */
.product-listing-page-top {
width: 100%;
}
.product-listing-page-top .intro p span {
display: block;
}
.intro:not(.smaller-text) p {
font-family: var(--font-text-medium);
font-size: clamp(20px, 2vw, 32px);
line-height: 28px;
letter-spacing: -0.1px;
margin-top: 0.875em;
margin-bottom: 0;
color: var(--color-black);
}
.intro:not(.smaller-text) .read-more-container p {
font-size: clamp(20px, 2vw, 32px);
line-height: 28px;
letter-spacing: -0.1px;
}
.intro.smaller-text p {
max-width: 833px;
}
/* end heading with text block */
/* heading with text block on category page */
.category-page-title-container .intro {
display: block;
max-width: 1078px;
}
.category-page-title-container .intro > h1{
font-weight: 600;
font-size: clamp(32px, 3vw, 40px);
line-height: clamp(28px, 3vw, 36px);
color: var(--color-black);
letter-spacing: -0.8px;
margin: 28px 0 48px 0;
}
.category-page-title-container h1 {
margin-bottom: 16px;
}
.category-page-title-container .intro:not(.smaller-text) > p,
.category-page-title-container .intro > p {
color:#000;
margin-bottom: 0px;
font-weight:600;
}
.category-page-title-container .intro:not(.smaller-text) p,
.category-page-title-container .intro p {
margin-top: 0;
}
.category-page-title-container .intro h1 ~ p {
font-family: var(--font-text-regular);
}
.category-price-container {
display: flex;
flex-direction: column;
gap: clamp(24px, 2vw, 32px);
}
.category-price-container,
.title-include-price {
margin-top: clamp(48px, 4vw, 60px);
margin-bottom: clamp(48px, 4vw, 64px);
}
.category-price-container p em,
.title-include-price em {
font-family: var(--font-display-regular);
margin-right: 5px;
font-style: normal;
}
.category-page-title-desktop,
.category-page-title-container .intro.category-page-title-desktop {
display: none;
}
.title-include-price h1,
.title-include-price p {
text-wrap: pretty;
}
.category-price-container .price{
color: var(--color-black) !important;
font-size: clamp(20px, 1.8vw, 28px) !important;
line-height: clamp(14px,1.2vw,20px) !important;
font-weight: 600 !important;
letter-spacing: -0.5px !important;
}
.category-price-container .description{
color: var(--color-black) !important;
font-size: clamp(20px, 1.8vw, 28px) !important;
line-height: clamp(28px, 2vw, 32px) !important;
font-weight: 600 !important;
}
@media (min-width: 1600px){
.category-price-container .price {
letter-spacing: -0.7px !important;
}
.category-price-container .description {
letter-spacing: 0 !important;
font-weight:600 !important;
}
}
/* end heading with text block on category page */
/* call to action block */
.cta-block {
position: relative;
}
.cta-block.bgcolor-grey {
background: rgba(243, 244, 246, 0.23);
}
.cta-block.with-bg {
padding: clamp(16px, 2vw, 32px);
}
/* end call to action block */
/* text with video */
.text-video {
display: grid;
gap: clamp(32px, 4vw, 64px);
}
.video-block .video-link {
display: block;
aspect-ratio: 1052 / 585;
position: relative;
}
.video-block .video-link::before {
content: "";
display: block;
width: clamp(65px, 7.5vw, 120px);
height: clamp(65px, 7.5vw, 120px);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 100;
background: url("/media/skin/environment/hub_play.svg") no-repeat 50% 50%;
background-size: cover;
}
.video-block img {
width: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
}
/* end text with video */
/* image with text banner */
.image-text-banner {
display: grid;
align-items: flex-end;
/* because of the main grid-container has a background colour and overlaps some elements */
position: relative;
z-index: 100;
}
.image-text-banner .image-text-banner--text {
position: relative;
padding: clamp(16px, 3vw, 52px) clamp(16px, 2vw, 32px);
}
.with-overshooting-img,
.dynamic-sizes > div + div.with-overshooting-img {
margin-top: 23%;
}
.with-overshooting-img picture {
margin-top: -14%;
display: block;
}
/* end image with text banner */
/* text with slider block */
.text-with-slider .pagination-outside {
min-width: 0; /* needs this line to fix display grid and swiper js bug */
}
.ls-slider.pagination-outside {
padding-bottom: clamp(35px, 3vw, 40px);
}
.ls-slider.fix-forhuge-screens.pagination-outside {
padding-bottom: clamp(35px, 3vw, 49px);
}
.ls-slider.pagination-outside .swiper-pagination,
.ls-slider.pagination-outside .swiper-pagination-bullets.swiper-pagination-horizontal {
bottom: 0;
}
.text-with-slider {
display: grid;
align-items: flex-start;
gap: 32px;
}
.text-with-slider:has(.read-btn) {
gap: 32px;
}
.text-with-slider:has(.read-btn) .read-btn {
margin-top: clamp(16px, 2.5vw, 20px);
}
.text-with-slider picture {
aspect-ratio: 3 / 2;
}
.text-with-slider .ls-slider .swiper-slide {
height: auto;
}
.text-with-slider .swiper-button-next,
.text-with-slider .swiper-button-prev,
.black-arrows .swiper-button-next,
.black-arrows .swiper-button-prev {
top: auto;
left: 0;
bottom: -8px;
transform: translateY(0);
background: url("/media/skin/icons/hub_chevron_right.svg") no-repeat 50% 50%;
background-size: 100%;
}
.text-with-slider .fix-forhuge-screens .swiper-button-next,
.text-with-slider .fix-forhuge-screens .swiper-button-prev {
bottom: 1px;
}
@media (hover: hover) {
.text-with-slider .swiper-button-next:hover,
.text-with-slider .swiper-button-prev:hover,
.black-arrows .swiper-button-next:hover,
.black-arrows .swiper-button-prev:hover {
background: url("/media/skin/environment/hub_chevron_right_black.svg") no-repeat 50% 50%;
background-size: contain;
}
}
.text-with-slider .swiper-button-next,
.black-arrows .swiper-button-next {
left: 32px;
right: auto;
}
.text-with-slider .swiper-button-prev,
.black-arrows .swiper-button-prev {
transform: scaleX(-1);
}
.text-with-slider .swiper-pagination {
width: auto;
}
.text-with-slider .swiper-pagination .swiper-pagination-bullet:first-child,
.text-with-slider .ls-slider .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet:first-child {
margin-left: 0;
}
.text-with-slider--text.ls-padding-right {
padding-right: 30px;
}
/* fix for swiper js when slider stops working because of parent display flex/grid */
.has-multiple-sliders .text-with-slider--text,
.trustpilot-reviews {
max-width: 100%;
overflow: hidden;
}
.texton-img {
position: relative;
}
.texton-img::before {
content: "";
display: block;
width: 100%;
height: 100%;
background: linear-gradient(5deg, rgba(0, 0, 0, 0.9), transparent 40%);
position: absolute;
top: 0;
left: 0;
z-index: 1;
pointer-events: none;
}
.texton-img .texton-img-grid {
display: grid;
grid-template-columns: auto 1fr;
gap: 8px;
position: absolute;
left: 0;
bottom: 12px;
z-index: 3;
}
.texton-img.with-titles .texton-img-grid {
bottom: 13px;
display: block;
}
.texton-img.with-titles .texton-img-grid > div {
display: grid;
grid-template-columns: auto 1fr;
gap: 6.35px;
padding-right: 6px;
}
.texton-img-title {
font-family: var(--font-text-regular);
font-size: 12px;
line-height: 20px;
letter-spacing: -0.06px;
color: var(--color-white);
padding-left: 18px;
}
.texton-img.with-titles p {
display: none;
}
.texton-img-grid .texton-img-triangle {
display: block;
width: 0;
height: 0;
border-top: 6.5px solid transparent;
border-bottom: 6.5px solid transparent;
border-left: 11.13px solid var(--color-cheshire);
margin-top: 2px;
}
.flower-show-carousel .texton-img-grid .texton-img-triangle {
margin-top: 6px;
}
.texton-img h3 {
font-family: var(--font-text-medium);
font-size: clamp(16px, 1.5vw, 24px);
line-height: 24px;
letter-spacing: -0.08px;
}
.texton-img h3,
.fs-clamp .texton-img h3 {
color: var(--color-white);
}
.texton-img h3 + p {
margin-top: 4px;
}
.dynamic-sizes .texton-img p,
.texton-img p {
font-size: 12px;
line-height: 16px;
letter-spacing: -0.06px;
}
.texton-img p,
.texton-img strong {
color: var(--color-white);
}
.texton-img p + p {
margin-top: 0;
}
/* end text with slider block */
/* three items slider block */
.ls-slider.three-items .swiper-pagination {
width: auto;
}
.three-items picture {
aspect-ratio: 336 / 215;
}
/* end three items slider block */
/* trustpilot widget */
.trustpilot-widget-container {
padding: 24px 0 24px 24px;
background: var(--color-background-main);
}
.trustpilot-widget-container > div {
display: grid;
}
.trustpilot-widget-container.pagination-outside {
margin-bottom: 64px;
}
.trustpilot-widget-container.pagination-outside .swiper-pagination {
text-align: left;
left: 24px;
bottom: -40px;
}
.mobile-trustpilot ~ .trustpilot-widget {
display: none;
}
.trustpilot-widget.fixed-width {
width: 116px;
height: 80px;
}
.trustpilot-score {
max-width: 246px;
margin-left: -35px;
margin-right: auto;
margin-bottom: 32px;
}
.trustpilot-review .review-top {
display: flex;
gap: 36.87px;
}
.trustpilot-review .review-top > img {
max-width: 126px;
}
.trustpilot-review .review-date {
flex-shrink: 0;
}
.trustpilot-review .review-text {
margin-top: 8px;
margin-bottom: 8px;
}
.trustpilot-review .read-btn {
margin-top: 0;
}
/* end trustpilot widget */
/* testimonial block */
.ls-testimonial-container,
.bg-padding {
padding-left: 24px;
padding-right: 24px;
}
.hub-page__feature-carousel-container {
padding-right: 0;
}
.ls-testimonial {
padding-top: 19px;
padding-bottom: 29px;
}
.ls-testimonial-people {
margin-top: 16px;
}
.ls-testimonial > .ls-testimonial-people {
margin-top: 0;
margin-bottom: 16px;
}
.ls-testimonial-people h2 {
font-size: clamp(12px, 2vw, 24px);
line-height: 20px;
letter-spacing: -0.06px;
margin-bottom: 0;
}
.ls-testimonial-people h2 span {
display: block;
font-family: var(--font-text-regular);
font-size: clamp(12px, 2vw, 16px);
line-height: 16px;
color: var(--color-emperor);
}
.ls-testimonial-people a {
color: var(--color-emperor);
text-decoration: underline;
}
.ls-testimonial-people picture {
margin-top: 0;
}
.ls-testimonial-people picture img {
width: 58px;
border-radius: 100%;
}
.ls-testimonial-text p {
letter-spacing: -0.1px;
}
.ls-testimonial-text > p > span > img {
width: 14.71px;
transform: translateY(-4px);
}
.ls-testimonial-text > p .on-desktop {
display: none;
}
.testimonial-left-icon,
.testimonial-right-icon {
display: inline-block;
}
.testimonial-left-icon {
margin-right: 3px;
}
.testimonial-right-icon {
margin-left: 3px;
}
.read-btn {
font-family: var(--font-text-medium);
margin-top: 16px;
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--color-cheshire);
cursor: pointer;
}
.fs-clamp .ls-testimonial .read-btn,
.fs-clamp .read-more-container .read-btn {
color: var(--color-cheshire);
}
.read-btn > span:first-of-type {
text-decoration: underline;
}
.read-btn.black-btn,
a.read-btn.black-btn,
a.read-btn.black-btn:hover,
a.read-btn.black-btn:focus {
color: var(--color-black);
}
.read-btn .read-icon {
width: 16px;
height: 16px;
background: url("/media/skin/icons/hub_chevron_right.svg") no-repeat 50% 50%;
background-size: contain;
}
.read-btn:hover .read-icon,
.read-btn:focus .read-icon {
background-image: url("/media/skin/icons/hub_chevron_right_black.svg");
}
.read-less .read-icon {
transform: rotate(180deg);
}
.read-more .read-icon,
.read-less .read-icon {
background-image: url("/media/skin/icons/read_more_icon.svg");
}
.read-more:hover .read-icon,
.read-more:focus .read-icon,
.read-less:hover .read-icon,
.read-less:focus .read-icon {
background-image: url("/media/skin/icons/read_more_icon_whole.svg");
}
.read-less,
.read-more-container.read-more-active .read-more,
.read-more-container.read-more-active .readmore-dots,
.location-block.read-more-active .read-more,
.location-block.read-more-active .readmore-dots {
display: none;
}
.read-more-container.read-more-active .read-less,
.location-block.read-more-active .read-less {
display: inline-flex;
}
.read-more-container .load-more-text {
display: none;
}
.read-more-container.read-more-active .load-more-text,
.location-block.read-more-active .load-more-text {
display: inline;
}
.learn-btn {
max-width: 137px;
letter-spacing: -0.08px;
text-align: center;
padding: 8px 16px;
display: inline-flex;
align-items: center;
gap: 10px;
flex-shrink: 0;
background-color: var(--color-cheshire);
transition: background-color 0.3s ease-in-out;
cursor: pointer;
}
.learn-btn,
.learn-btn:hover,
.learn-btn:focus,
a.learn-btn,
a.learn-btn:hover,
a.learn-btn:focus {
color: var(--color-white);
}
.learn-btn:hover,
.learn-btn:focus {
background-color: var(--color-dark-orange);
}
.learn-btn .read-icon {
width: 10px;
height: 11px;
background: url("/media/skin/icons/chevron_left_white.svg") no-repeat 50% 50%;
background-size: contain;
transform: rotate(180deg);
}
.learn-btn.white-bg {
background-color: var(--color-white);
}
.learn-btn.white-bg:hover,
.learn-btn.white-bg:focus {
background-color: var(--color-bombay);
}
.learn-btn.white-bg,
.learn-btn.white-bg:hover,
.learn-btn.white-bg:focus,
a.learn-btn.white-bg,
a.learn-btn.white-bg:hover,
a.learn-btn.white-bg:focus {
color: var(--color-black);
}
.learn-btn.white-bg .read-icon {
background: url("/media/skin/icons/chevron_left_orange.svg") no-repeat 50% 50%;
background-size: contain;
}
/* end testimonial block */
/* icons next to each other */
.icons-container {
margin: 24px 0;
}
.icons-container ul {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 33px;
row-gap: 16px;
}
.icons-container a {
display: inline-block;
}
/* end icons next to each other */
/* banner with text */
.banner-text {
position: relative;
/* because of the main grid-container has a background colour and overlaps some elements */
z-index: 100;
}
.banner-text > picture img {
position: absolute;
width: 100%;
height: 100%;
z-index: -1;
object-fit: cover;
object-position: 50% 100%;
}
.banner-text .mobile-img img {
object-position: 50% 100%;
}
.banner-text .desktop-img {
display: none;
}
.banner-text--text {
padding: 16px 24px 311px;
}
.banner-text--text h2,
.fs-clamp .banner-text--text h2,
.banner-text--text p,
.banner-text--text strong {
color: var(--color-white);
}
.banner-text--text > p {
max-width: 271px;
margin-bottom: 23px;
}
.number-square-text {
display: flex;
align-items: center;
gap: 17px;
}
.number-square-text img {
width: 46px;
}
.number-square-text p {
font-family: var(--font-display-regular);
font-size: 20px;
line-height: 28px;
letter-spacing: 1px;
text-transform: uppercase;
}
/* end banner with text */
/* showroom search page */
.showroom-listings {
counter-reset: showrooms;
}
.showroom-search-container {
margin-top: 24px;
padding-bottom: 40px;
border-bottom: 0.25px solid var(--color-bombay);
}
.showroom-search-container > p {
font-family: var(--font-text-medium);
font-size: clamp(16px, 2.5vw, 24px);
line-height: 24px;
letter-spacing: -0.08px;
color: var(--color-black);
margin-bottom: 16px;
}
.showroom-search-container.no-absolute {
margin-top: 0;
padding-bottom: 0;
border-bottom: none;
}
.showroom-search-container.no-absolute h2 {
margin-bottom: 24px;
}
.showroom-search-container.no-absolute input[type="text"] {
background-color: var(--site-background-color);
}
.showroom-listing-container .listing-left {
margin-bottom: 40px;
}
.showroom-listing-container.featured-box {
padding-bottom: clamp(32px, 5vw, 80px);
border-bottom: 0.25px solid var(--color-bombay);
}
.showroom-listing-container.featured-box .listing-left {
margin-bottom: 25.5px;
}
.showroom-listing-container .listing-left h2 {
margin-bottom: 0;
}
h2 ~ .showroom-types {
margin-top: 16px;
}
.showroom-types img {
width: 16px;
}
.showroom-types,
.showroom-types .showroom-type {
display: flex;
align-items: center;
}
.showroom-types {
gap: 32px;
}
.showroom-types .showroom-type {
gap: 8px;
}
.showroom-location {
display: flex;
align-items: center;
gap: 16px;
flex-shrink: 0;
}
.showroom-location.minwidth-fix {
min-width: 82px;
}
.showroom-title-container {
flex-shrink: 0;
}
.showroom-title-container a {
font-family: var(--font-text-medium);
font-size: clamp(16px, 2.5vw, 24px);
line-height: 24px;
letter-spacing: -0.08px;
display: flex;
align-items: center;
gap: clamp(16px, 1.5vw, 24px);
}
.showroom-title-container a,
.showroom-title-container a:hover,
.showroom-title-container a:focus {
color: var(--color-black);
}
.showroom-title-container span {
width: clamp(16px, 2.5vw, 24px);
height: clamp(16px, 2.5vw, 24px);
background: url("/media/skin/icons/hub_chevron_right.svg") no-repeat 50% 50%;
background-size: contain;
}
.showroom-distance,
p.showroom-distance {
font-family: var(--font-text-regular);
font-size: 12px;
line-height: 20px;
letter-spacing: -0.06px;
}
.showroom-title-container a:hover .showroom-title,
.showroom-title-container a:focus .showroom-title {
text-decoration: underline;
}
.showroom-title-container a:hover span,
.showroom-title-container a:focus span {
background-image: url("/media/skin/icons/hub_chevron_right_black.svg");
}
.ls_showroom_item {
padding-top: 16px;
padding-bottom: 16px;
border-bottom: 0.5px solid var(--color-emperor);
counter-increment: showrooms;
}
.ls_showroom_item:first-of-type {
padding-top: 0;
}
.ls_showroom_item .showroom-left {
display: flex;
align-items: center;
gap: 32px;
}
.ls_showroom_item .showroom-right {
justify-content: space-between;
align-items: center;
gap: 32px;
display: none;
}
.ls_showroom_item .showroom-desc {
max-width: 500px;
font-family: var(--font-text-regular);
font-size: 1em;
line-height: 20px;
color: var(--color-emperor);
letter-spacing: -0.06px;
}
.ls_showroom_item .showroom-desc strong {
font-family: var(--font-text-medium);
}
.ls_showroom_item .showroom-desc strong,
.ls_showroom_item .showroom-desc strong ~ p {
display: inline;
}
.ls_showroom_item .showroom-desc p + p {
display: none;
}
.with-videotour {
flex-shrink: 0;
}
.with-videotour img {
width: 25px;
margin-right: 5.33px;
}
.with-videotour a {
font-family: var(--font-text-regular);
font-size: 12px;
line-height: 18px;
letter-spacing: -0.06px;
display: flex;
align-items: center;
gap: 5px;
}
.with-videotour a,
.with-videotour a:hover,
.with-videotour a:focus {
color: var(--color-emperor);
}
.with-videotour a span {
text-decoration: underline;
}
.showroom-featured .ls_showroom_item {
padding-bottom: 0;
border-bottom: 0;
}
.showroom-featured .ls_showroom_item .showroom-right {
display: flex;
justify-content: flex-start;
}
.showroom-featured .showroom-left a {
width: 100%;
height: 100%;
aspect-ratio: 312 / 208;
position: relative;
}
.showroom-featured .showroom-left a img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
z-index: 10;
}
.showroom-featured .showroom-right {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 9px;
padding: 16px;
background-color: var(--color-background-main);
}
.showroom-featured .showroom-right .showroom-title-container {
margin-bottom: 16px;
}
.showroom-featured .showroom-title-container a {
gap: 8px;
}
.location-marker {
position: relative;
flex-shrink: 0;
}
.ls_showroom_item[data-counter] .location-marker::after {
content: counter(showrooms, upper-alpha);
font-family: var(--font-text-regular);
font-size: 12px;
line-height: 16px;
letter-spacing: -0.06px;
color: var(--color-white);
text-align: center;
width: 100%;
height: 100%;
position: absolute;
top: 3px;
left: 0;
}
/* end showroom search page */
/* Frazer's showroom map */
#map {
width: 100%;
height: 468px;
border: 2px solid #D0D1DC;
}
.property {
font-size: 14px;
width: 21px;
height: 30px;
margin-top: -6px;
padding: 6px 0px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
gap: 15px;
position: relative;
z-index: 1;
}
.property .ls-pointer {
background-image: url("/media/skin/icons/marker_blue.svg");
width: 21px;
height: 30px;
cursor: pointer;
}
.property .ls-pointer.light-orange {
background-image: url("/media/skin/icons/marker_beige.svg");
}
.property:hover .ls-pointer,
.property .ls-pointer.showroom-pointer {
background-image: url("/media/skin/icons/marker_orange.svg");
}
.property.highlight .ls-pointer {
background-image: url("/media/skin/icons/marker_orange.svg");
position: absolute;
left: 50%;
bottom: -55px;
transform: translateX(-50%);
}
.map-marker-label {
width: 16px;
height: 16px;
color: var(--color-white);
background: var(--color-navy);
border-radius: 32px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
position: absolute;
top: 3px;
left: 2px;
line-height: 1;
}
.map-marker-label.light-orange {
background: var(--color-light-orange);
}
.property:hover .map-marker-label {
background: var(--color-cheshire);
}
.property button {
width: 24px;
height: 24px;
text-indent: -1000em;
background: transparent url("/media/skin/icons/icon_close.svg") no-repeat 50% 50%;
border-radius: 50%;
border: 0;
margin-top: 0;
padding: 0;
position: absolute;
top: 8px;
right: 8px;
cursor: pointer;
display: none;
}
.property.highlight::after {
content: "";
width: 100%;
height: 25px;
position: absolute;
top: 100%;
left: 0;
background: url("/media/skin/icons/map_triangle.png") no-repeat 50% 50%;
z-index: 1;
}
.property .icon {
color: var(--color-white);
display: flex;
justify-content: center;
align-items: center;
}
.property .icon svg {
width: auto;
height: 10px;
}
.property .image {
width: 100%;
position: relative;
aspect-ratio: 168 / 112;
display: none;
}
.property .details {
flex-direction: column;
flex: 1;
display: none;
}
.property .address {
font-size: 10px;
color: #9E9E9E;
margin-top: 5px;
margin-bottom: 10px;
}
.property .features {
display: flex;
flex-direction: row;
align-items: flex-end;
gap: 10px;
}
.property .features > div {
font-size: 10px;
padding: 5px;
background: #F5F5F5;
border: 1px solid var(--color-silver);
border-radius: 5px;
display: flex;
align-items: center;
gap: 5px;
}
/* Property styles in highlighted state */
.property.highlight {
width: 168px;
height: auto;
padding: 0;
background-color: var(--color-white);
border-radius: 0;
display: block;
position: relative;
bottom: 55px;
z-index: 999;
cursor: default;
}
.property.highlight .icon {
display: none;
}
.property.highlight .image img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
opacity: 0;
}
.property.highlight .image,
.property.highlight button {
display: block;
z-index: 999;
}
.property.highlight .details {
width: 100%;
display: block;
padding: 8px;
}
.property.highlight .details p {
font-size: 10px;
line-height: 16px;
letter-spacing: -0.05px;
margin: 0;
}
.ls-time-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 8px;
}
.property.highlight .details p em {
font-style: normal;
}
.property.highlight .details p:first-child {
font-size: 12px;
line-height: 16px;
letter-spacing: -0.06px;
margin-bottom: 4px;
}
.property.highlight .details p:last-child {
margin-top: 0;
display: flex;
}
.property.highlight .details a {
font-family: var(--font-text-regular);
font-size: 16px;
line-height: 24px;
letter-spacing: -0.08px;
color: var(--color-white);
margin-top: 12px;
padding: 8px 16px;
background-color: var(--color-cheshire);
text-decoration: none;
transition: background-color 0.3s ease;
}
.property.highlight .details a:hover,
.property.highlight .details a:focus {
background-color: var(--color-dark-orange);
}
@keyframes drop {
0%{
opacity: 0;
}
50%{
opacity: 1;
}
100%{
opacity: 1;
}
}
.drop {
animation: drop 0.3s linear forwards var(--delay-time);
}
@keyframes fadein {
0% {
opacity: 0;
z-index: 1;
}
100% {
opacity: 1;
z-index: 1;
}
}
.fadein {
animation: fadein 0.3s linear forwards 0.2s;
}
/* end Frazer's showroom map */
/* showroom page */
.get-direction {
margin-top: 24px;
margin-bottom: 23.5px;
}
.get-direction:hover a span {
text-decoration: underline;
}
.get-direction a {
font-family: var(--font-text-regular);
font-size: 12px;
line-height: 20px;
letter-spacing: -0.06px;
color: var(--color-emperor);
display: flex;
align-items: center;
gap: 13px;
}
.showroom-tel {
display: inline-block;
margin-top: 8px;
}
.showroom-tel:hover,
.showroom-tel:focus {
text-decoration: underline;
}
.data-item {
padding: 23.5px 0;
border-bottom: 0.5px solid var(--color-emperor);
}
.showroom-message p {
padding-top: 23.5px;
}
.showroom-message p,
.showroom-message strong,
.showroom-message p a {
color: var(--color-emperor);
}
.showroom-message a:hover,
.showroom-message a:focus {
color: var(--color-black);
}
.showroom-message .data-item {
padding-top: 16px;
}
.data-item:not(.not-firstchild):first-of-type {
border-top: 0.5px solid var(--color-emperor);
}
.data-item h2 {
margin-bottom: 8px;
}
.facilities-block h2 {
margin-bottom: 12px;
}
.data-item p + p,
.data-item p + div {
margin-top: clamp(16px, 2vw, 24px);
}
.data-item a,
.data-item .with-videotour a {
color: var(--color-black);
text-decoration: underline;
}
.opening-block > div {
max-width: 312px;
}
.opening-hours {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
}
.bank-hours {
display: block;
margin-top: 24px;
}
.facilities-container img {
width: 24px;
}
.facilities-container ul {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 17px;
/* if sort order is important */
/* display: block;
column-count: 2; */
}
.facilities-container li {
display: grid;
grid-template-columns: auto 1fr;
align-items: center;
gap: 24px;
}
.staff-container {
padding-bottom: 24px;
border-bottom: 0.25px solid var(--color-bombay);
}
.staff-container .left-container p {
margin-bottom: 24px;
}
.staff-container .right-container {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 24px;
}
.showroom-page .staff-container .member-text h2,
.dynamic-sizes.showroom-page .staff-container .member-text h2 {
margin-bottom: 8px;
}
.showroom-member h2 {
margin-bottom: 8px;
}
.showroom-member > div:first-child {
position: relative;
width: 100%;
aspect-ratio: 144 / 216;
}
.showroom-member img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
}
.showroom-member > div:last-child {
padding: 8px 8px 40px;
background: var(--color-background-main);
}
.showroom-products picture {
display: block;
}
.showroom-product {
padding-top: clamp(8px, 2.5vw, 24px);
}
.showroom-product h3 {
margin-bottom: clamp(9px, 2.5vw, 17px);
}
.showroom-product .read-btn {
margin-top: 0;
}
.faqs-container h2 {
margin-bottom: 24px !important;
}
.faq-item {
margin-bottom: 16px;
padding-bottom: 16px;
border-bottom: 0.5px solid var(--color-emperor);
}
.faq-item:last-child {
margin-bottom: 0;
}
.faq-item .faq-item-header {
display: flex;
justify-content: space-between;
align-items: center;
gap: 8px;
cursor: pointer;
}
.faq-item .faq-item-header::after {
content: "";
display: inline-block;
flex-shrink: 0;
width: 9px;
height: 8px;
background: url("/media/skin/icons/faq_icon.svg") no-repeat 50% 50%;
background-size: contain;
transition: transform 0.3s ease-in-out;
}
.faq-item .faq-item-header p {
font-family: var(--font-text-medium);
color: var(--color-black);
}
.faq-item-body {
display: none;
}
.faq-item.open .faq-item-body {
display: block;
}
.faq-item.open .faq-item-header {
margin-bottom: 16px;
}
.faq-item.open .faq-item-header::after {
transform: rotate(180deg);
}
.location-block.read-more-active {
padding-bottom: 0;
}
#showroom_map {
width: 0;
transition: width 0.3s ease-in-out;
}
.location-block.read-more-active #showroom_map {
width: 100%;
aspect-ratio: 312 / 207;
margin-top: 24px;
opacity: 1;
}
/* for future carousels use a class like: overgrow-parent-when-scrolling and add this css rule to its swiper so it can overgrow the parent on all screen sizes */
.showroom-products-container .swiper {
overflow: initial !important;
}
/* end showroom page */
/* porcelain hub page */
.hub-page__feature-carousel-container.bgcolor-grey {
padding-top: 26px;
}
.hub-page__feature-carousel .swiper {
padding-top: 16px;
}
.hub-page__feature-holder {
background-color: var(--color-white);
border: 1px solid var(--color-cheshire);
padding-left: 16px;
padding-right: 16px;
height: calc(100% - 5px);
}
.hub-page__feature-holder:last-of-type {
margin-right: 1px; /* needs this line to fix border is not visible issue in some browsers */
}
.hub-page__feature-holder > div {
padding-top: 23px;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
}
.hub-page__feature-popular {
border-top-width: 3px;
height: calc(100% - 7px);
}
.hub-page__feature-popular__banner {
position: absolute;
top: -7%;
}
.hub-page__feature-popular__banner span {
background: white;
border: 1px solid var(--color-cheshire);
border-radius: 24px;
padding: 3px 22px;
color: var(--color-cheshire);
font-family: var(--font-display-medium);
letter-spacing: 3.6px;
font-size: 12px;
text-transform: uppercase;
}
.hub-page__feature-heading1 {
font-family: var(--font-text-medium);
font-size: clamp(12px, 2.5vw, 16px);
letter-spacing: clamp(0.06px, 2.5vw, 0.08px);
line-height: 24px;
color: var(--color-cheshire);
}
.hub-page__feature-heading2 {
font-family: var(--font-text-medium);
font-size: 32px;
line-height: 48px;
letter-spacing: 0;
color: var(--color-black);
margin-top: 0;
}
.hub-page__feature-heading3 {
font-family: var(--font-text-regular);
font-size: clamp(13px, 2.5vw, 16px);
line-height: clamp(20px, 2.5vw, 24px);
letter-spacing: 0.08px;
color: var(--color-black);
}
.hub-page__feature-holder ul {
margin-top: 28px;
border-top: 1px solid #7B716D;
width: 100%;
padding-bottom: 32px;
}
.hub-list li {
font-family: var(--font-text-regular);
line-height: 24px;
letter-spacing: -0.08px;
color: var(--color-emperor);
display: flex;
align-items: center;
gap: 12px;
}
.hub-page__feature-holder li {
width: 100%;
padding: 12px 0;
border-bottom: 0.5px solid var(--color-emperor);
}
.hub-page__feature-holder li strong {
color: var(--color-black);
}
.dynamic-sizes > div + div.good-points-container:not(.porcelain-hub-good-points) {
margin-top: clamp(45px, 7vw, 128px);
}
.good-points-container {
display: grid;
}
.good-points-container .hub-list {
margin-top: 32px;
}
.good-points-container .hub-list li {
line-height: 17px;
}
.good-points-container .hub-list li + li {
margin-top: 15px;
}
.good-points-container picture {
display: block;
}
.good-points-container img {
width: 100%;
}
.good-points-text {
padding: 0 16px 16px;
background-color: var(--color-dawn-pink);
}
.good-points-text p {
max-width: 702px;
}
.hub-triangle {
display: inline-block;
width: 0;
height: 0;
border-top: 4.5px solid transparent;
border-bottom: 4.5px solid transparent;
border-left: 7.89px solid var(--color-cheshire);
}
.porcelain-paving-hero picture {
display: block;
aspect-ratio: 1051 / 483;
}
.porcelain-paving-hero img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
mix-blend-mode: multiply;
}
.porcelain-paving-hero .with-videolink::before {
transform: translate(-50%, -59%);
}
.collection-container picture {
display: block;
position: relative;
aspect-ratio: 360 / 168;
}
.collection-container img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
}
/* Blog post carousel, used on CMS pages although it could be handled elsewhere too. It's a phtml file hooked in the page logic... */
.blog-with-text {
display: grid;
gap: 32px;
}
.blog-with-text h2,
.fs-clamp .blog-with-text h2 {
font-size: clamp(20px, 2vw, 32px);
}
.blog-with-text .ls-slider {
max-width: 100%;
overflow: hidden;
padding-bottom: clamp(35px, 3vw, 44px);
}
.blog-post-carousel:not(.swiper-initialized) > ul {
display: flex;
flex-wrap: wrap;
gap: 32px;
}
.blog-post-carousel:not(.swiper-initialized) .cms-page__blog-image img,
.blog-post-carousel:not(.swiper-initialized) .cms-page__blog-image,
.blog-post-carousel:not(.swiper-initialized) .cms-page__blog-image a {
max-width: 376px;
}
.blog-post-carousel .swiper-slide {
height: auto;
}
.cms-page__blog-container {
background-color: var(--color-background-main);
height: 100%;
display: flex;
flex-direction: column;
}
.cms-page__blog-image,
.cms-page__blog-image a {
aspect-ratio: 376 / 251;
}
.cms-page__blog-image a {
display: block;
position: relative;
}
.cms-page__blog-image img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
}
.cms-page__blog-text {
padding: 12px 22px 22px;
display: grid;
justify-content: space-between;
flex-grow: 1;
}
.cms-page__blog-text > div:last-child {
align-self: flex-end;
}
.cms-page__blog-text__date {
font-family: var(--font-text-medium);
font-size: 12px;
line-height: 20px;
letter-spacing: -0.06px;
margin-bottom: 12px;
}
.cms-page__blog-text__heading {
position: relative;
}
.cms-page__blog-text__heading .hub-triangle {
position: absolute;
top: 6.5px;
left: -22px;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-left: 14px solid var(--color-cheshire);
}
.cms-page__blog-text__heading a {
font-family: var(--font-text-medium);
font-size: clamp(20px, 2.5vw, 24px);
line-height: 28px;
letter-spacing: -0.1px;
color: var(--color-black);
margin-bottom: 16px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.cms-page__blog-text__excerpt {
margin-bottom: 0;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3; /* start showing ellipsis when 3rd line is reached */
}
.blog-post-carousel-container .swiper-button-next,
.blog-post-carousel-container .swiper-button-prev {
display: none;
}
.blog-post-carousel-container .swiper-pagination-bullets.swiper-pagination-horizontal {
text-align: left;
}
.blog-post-carousel-container .swiper-pagination .swiper-pagination-bullet:first-child,
.blog-post-carousel-container .ls-slider .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet:first-child {
margin-left: 0;
}
.blog-post-carousel-container .read-btn {
margin-top: clamp(16px, 2.5vw, 20px);
}
.blog-with-text .black-arrows .swiper-button-prev,
.blog-with-text .black-arrows .swiper-button-next {
bottom: 0;
}
/* end blog post carousel */
.hub-video {
aspect-ratio: 360 / 196;
position: relative;
}
.hub-video video {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
}
.hub-page__feature-carousel,
.ls-slider.pagination-outside.hub-page__feature-carousel {
padding-bottom: 59px;
}
.hub-page__feature-carousel .swiper-pagination,
.ls-slider.pagination-outside.hub-page__feature-carousel .swiper-pagination-bullets.swiper-pagination-horizontal {
bottom: 25px;
}
.content-trustpilot {
display: grid;
gap: 23px;
}
.people-text {
max-width: 1328px;
margin-left: auto;
margin-right: auto;
display: grid;
align-items: flex-end;
position: relative;
background: var(--color-athens-gray);
}
.people-text .media {
text-align: center;
margin-top: -14%;
margin-bottom: 0;
padding-left: 0;
padding-right: 0;
}
.people-text.bespoke-porcelain .media img {
max-width: 506px;
width: 100%;
}
.people-text .text {
padding: 0 16px 16px;
background: var(--color-athens-gray);
}
.discover-banner {
position: relative;
max-width: 312px;
margin-left: auto;
margin-right: auto;
}
.discover-banner > a {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 6;
}
.discover-banner picture {
width: 100%;
height: 100%;
display: block;
position: relative;
aspect-ratio: 312 / 380;
}
.discover-banner picture img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
}
.discover-banner > div {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 24px;
padding: 16px;
position: absolute;
top: 0;
left: 0;
z-index: 5;
}
.discover-banner h2 {
max-width: 420px;
}
.discover-banner h2,
.fs-clamp .discover-banner h2 {
font-family: var(--font-text-regular);
margin-bottom: 0;
}
.discover-banner h2 strong,
.fs-clamp .discover-banner h2 strong {
font-family: var(--font-text-medium);
}
.discover-banner h2,
.fs-clamp .discover-banner h2 {
color: var(--color-emperor);
}
.discover-banner h2 strong,
.fs-clamp .discover-banner h2 strong {
color: var(--color-black);
}
.image-with-text-box {
max-width: 1328px;
margin-left: auto;
margin-right: auto;
padding: 60% 16px 16px;
position: relative;
z-index: 1;
background: #062F07;
}
.image-with-text-box > picture img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: contain;
object-position: top;
z-index: 2;
}
.text-box {
padding: 16px;
background: var(--color-white);
position: relative;
z-index: 4;
}
.text-box::before {
content: "";
display: inline-block;
width: 0;
height: 0;
border-left: 16px solid transparent;
border-right: 16px solid transparent;
border-bottom: 32px solid var(--color-white);
position: absolute;
top: -32px;
left: 50%;
transform: translateX(-50%);
z-index: 1;
}
.text-box-title-logo img {
margin-bottom: 16px;
}
/* end porcelain hub page */
/* product listing page */
.dynamic-sizes > div + div.product-listing-container {
margin-top: 0;
}
.dynamic-sizes p + p.close-filter-btn {
margin-top: 0;
}
.filter-shadow-modal {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 2099;
background: #0000008a;
visibility: hidden;
opacity: 0;
}
.has-border-bottom {
padding-bottom: 32px;
border-bottom: 1px solid #E1E1E1;
}
.product-listing-page-top:has(.ls-category-banner) .has-border-bottom {
padding-bottom: 0;
border: none;
}
.ls-category-banner picture {
position: relative;
display: block;
aspect-ratio: 360 / 196;
}
.ls-category-banner picture img {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
}
.product-listing-container {
display: grid;
align-items: flex-start;
}
.products-grid__filters {
padding: 24px 0;
background: var(--color-white);
}
.ls-category__filter-block {
margin-bottom: 16px;
padding-bottom: 16px;
padding-left: 24px;
padding-right: 24px;
border-bottom: 1px solid #D1D6DA;
}
.ls-category__filter-block h3 {
font-family: var(--font-text-medium);
font-size: clamp(16px, 2vw, 20px);
line-height: 24px;
letter-spacing: 0.1px;
margin-bottom: 24px;
display: flex;
justify-content: space-between;
align-items: center;
gap: 8px;
position: relative;
cursor: pointer;
}
.ls-category__filter-block h3,
.fs-clamp .ls-category__filter-block h3 {
color: var(--color-black);
font-size: 16px;
line-height: 11px;
font-weight: 400;
letter-spacing: -0.4px;
}
.ls-category__filter-block h3::before {
content: "";
display: block;
width: 100%;
height: calc(100% + 10px);
position: absolute;
top: -5px;
left: 0;
}
.ls-category__filter-block h3::after {
content: "";
display: inline-block;
width: 14px;
height: 16px;
background: url("https://d1ctifminpgohi.cloudfront.net/category-page/category-arrow-down.svg") no-repeat 50% 50%;
background-size: contain;
transform: rotate(180deg);
transition: transform 0.3s ease-in-out;
}
.ls-category__filter-block label,
.ls-checkbox label {
font-family: var(--font-text-regular);
font-size: 16px;
line-height: 11px;
letter-spacing: -0.4px;
font-weight: 400;
color: var(--color-black);
display: flex;
justify-content: space-between;
align-items: center;
gap: 8px;
margin-bottom: 16px;
}
.ls-category__filter-block label + label,
.ls-checkbox label + label {
margin-top: 8px;
}
.cross-icon {
display: inline-block;
width: 24px;
height: 24px;
background: url("/media/skin/icons/cross_icon.svg") no-repeat 50% 50%;
background-size: contain;
}
.close-filter-btn {
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
}
.close-filter-btn span:not(.filter-txt) {
display: inline-block;
color: #B0B8B9;
width: auto;
height: 11px;
font-size: 16px;
line-height: 11px;
font-weight: 500;
background: none;
cursor: pointer;
letter-spacing: -0.4px;
}
.filter-btn-style {
padding: 8px 16px;
background: transparent;
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
}
.product-listing-container .filter-btn-style{
color: var(--color-black);
font-size: 16px;
line-height: 11px;
letter-spacing: -0.4px;
font-weight: 500;
padding: 0;
width: 100%;
height: 46px;
justify-content: center;
border: 1px solid #D1D6DA;
border-bottom: 4px solid #C09A5F;
}
.product-listing-container .filter-btn-style .filter-txt{
display: flex;
align-items: center;
gap: 8px;
}
.filter-btn-style strong {
font-family: var(--font-text-medium);
}
.filter-btn-style span:last-child {
content: "";
display: inline-block;
width: 14px;
height: 16px;
}
.main-product-filter-container .ls-products-grid {
margin: 0;
}
.controls-of-filter-popup .close-product-filter,
.main-product-filter-container.filter-open .controls-of-filter-popup .open-product-filter {
display: none;
}
.main-product-filter-container.filter-open .controls-of-filter-popup .close-product-filter{
display: flex;
justify-content: space-between;
color: var(--color-black);
font-size: 16px;
line-height: 11px;
font-weight: 500;
letter-spacing: -0.4px;
height: 60px;
padding: 0 24px;
background: transparent;
border-top: 1px solid #D1D6DA;
border-bottom: 4px solid #C09A5F;
}
.main-product-filter-container.filter-open .controls-of-filter-popup .close-product-filter .filter-txt{
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
}
.product-listing-container .products-grid__filter--holder {
visibility: hidden;
opacity: 0;
}
.product-listing-container .products-grid__filter--holder > div.products-grid__filters {
display: none;
}
.main-product-filter-container.filter-open .products-grid__filter--holder {
visibility: visible;
opacity: 1;
}
.main-product-filter-container.filter-open .products-grid__filter--holder > div.products-grid__filters {
display: block;
}
.main-product-filter-container.hide-swatches #show_swatches_mobile,
.main-product-filter-container.hide-swatches #show_swatches_desktop {
display: none;
}
.filter-swatches-controls {
display: grid;
grid-template-columns: auto 1fr;
gap: 16px;
}
.filter-swatches-controls .filter-btn-style {
max-width: 203px;
}
.filter-swatches-controls .filter-btn-style,
.category-page-title-container .sort-swatches > div:first-child .filter-btn-style,
.swatches,
#sort-disp,
#clear-filters,
.products-grid__filter--results > div > div,
#resultCount {
font-size: 16px;
}
.show-swatches {
display: flex;
align-items: center;
gap: clamp(6px, 2vw, 16px);
}
.show-swatches p {
font-size: clamp(12px, 1vw, 16px) !important;
font-family: var(--font-text-regular) !important;
}
#show_swatches_desktop {
display: none;
}
#show_swatches_mobile {
margin-bottom: 22px;
}
.swatches {
display: flex;
}
.remove-main-btn-styles {
font-size: inherit;
line-height: inherit;
letter-spacing: inherit;
text-transform: none;
margin: 0;
padding: 0;
border: none;
cursor: pointer;
}
.swatches button {
color: #D7D4D9;
padding: 2px 8px;
background: var(--color-background-main);
transition: all 0.3s ease-in-out;
}
.swatches button.swatch--on:focus,
.swatches button.swatch--on:active,
.swatches button.swatch--on.active {
color: var(--color-white);
background: var(--color-cheshire);
}
.swatches button.swatch--off:focus,
.swatches button.swatch--off:active,
.swatches button.swatch--off.active {
color: var(--color-white);
background: var(--color-emperor);
}
.sort-products span:last-child {
transform: rotate(-90deg);
}
.products-grid__filters-buttons {
display: flex;
justify-content: center;
align-items: center;
gap: 24px;
padding: 11px 24px;
background: #F9FAFA;
border-top: 1px solid #D1D6DA;
}
.clear-filters {
text-decoration: underline;
}
.clear-filters,
.clear-filters:hover,
.clear-filters:active {
color: var(--color-emperor);
background: transparent;
}
.filter-results {
padding: 8px 16px;
}
.filter-results,
.filter-results:active {
color: var(--color-white);
background: #585255;
}
.filter-display__colour .ls-category__filter-block__inner {
max-width: 416px;
display: grid;
grid-template-columns: 1fr 1fr;
row-gap: 12px;
column-gap: 16px;
}
.ls-checkbox label,
.filter-display__colour label:not(.ls-category__filter-disabled),
.filter-display__application label,
.ls-category__filter-block label:not(.ls-category__filter-disabled) input,
.ls-checkbox label input {
cursor: pointer;
}
.filter-display__colour label + label,
.filter-display__application label + label {
margin-top: 0;
}
.ls-category__filter-block label input,
.ls-checkbox label input {
margin-top: 0;
margin-right: 19px;
}
.filter-display__brand label span:first-child,
.ls-checkbox label span:first-child,
.filter-display__colour label span:first-child,
.filter-display__application label span:first-child {
position: relative;
}
.filter-display__brand label span:first-child::before,
.ls-checkbox label span:first-child::before {
content: "";
width: 16px;
height: 16px;
background: var(--color-white);
border: 0;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
left: 0;
top: 47%;
transform: translateY(-50%);
background-image: url("https://d1ctifminpgohi.cloudfront.net/icons/checkbox-off.svg");
background-repeat: no-repeat;
background-size: 16px 16px;
}
.filter-display__brand label:has(input:hover) span:first-child::before,
.ls-checkbox label:has(input:hover) span:first-child::before{
content: "";
background-image: url("https://d1ctifminpgohi.cloudfront.net/icons/checkbox-hover.svg");
background-repeat: no-repeat;
background-size: 16px 16px;
border:0;
}
.filter-display__brand label:has(input:checked) span:first-child::before,
.ls-checkbox label:has(input:checked) span:first-child::before {
content: "";
background-image: url("https://d1ctifminpgohi.cloudfront.net/icons/checkbox-checked.svg");
background-size: 16px 16px;
border:0;
}
.filter-display__colour label input,
.filter-display__application input {
margin-right: 45px;
opacity: 0;
}
.filter-display__colour label span:first-child {
display: block;
padding: 14px 0;
}
.filter-display__colour label span:first-child > span {
width: 46px;
height: 46px;
border-radius: 100%;
position: absolute;
top: 50%;
left: -2px;
transform: translateY(-50%);
transition: all 0.3s ease-in-out;
background-size: contain;
background-position: center center;
}
.filter-display__colour label span:first-child.filter__add-border-for-light > span {
border: 0.5px solid var(--color-emperor);
}
.filter-display__colour label:has(input:checked) span:first-child > span {
transform: translateY(-50%) scale(0.78);
}
.filter-display__colour label span:first-child > span::before {
content: "";
width: calc(100% + 10px);
height: calc(100% + 10px);
border: 2px solid var(--color-cheshire-border);
border-radius: 100%;
position: absolute;
top: -5px;
left: -5px;
display: none;
}
.filter-display__colour label span:first-child.filter__add-border-for-light > span::before {
width: calc(100% + 12.5px);
height: calc(100% + 12.5px);
top: -6.25px;
left: -6.25px;
}
.filter-display__colour label:has(input:checked) span:first-child > span::before {
display: block;
}
.products-grid__filter--results {
margin-top: 24px;
margin-bottom: 24px;
}
.products-grid__filter--results.products-grid__no-filters {
margin-top: 0;
}
.products-grid__filter--results,
.products-grid__filter--results > div {
display: flex;
align-items: center;
flex-wrap: wrap;
column-gap: 24px;
row-gap: 24px;
}
.products-grid__filter--results > div > div {
font-family: var(--font-text-regular);
color: var(--color-black);
padding: 8px 16px;
background: #EDEFF0;
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
}
#sort-disp {
width: 100%;
height: 46px;
color: var(--color-black);
font-size: 16px;
line-height: 11px;
letter-spacing: -0.4px;
font-weight: 500;
background: var(--color-white);
border: 1px solid #C4CCCE;
border-bottom: 4px solid #C09A5F;
padding: 0;
display: flex;
align-items: center;
padding-left: 12px;
}
#sort-disp span{
color: var(--color-black);
}
.select-box .options-container {
background: var(--color-white);
color: var(--color-black);
max-height: 0;
width: 100%;
max-width: 145px;
opacity: 0;
transition: all 0.3s;
overflow: hidden;
position: absolute;
top: 60px;
order: 1;
z-index: 100;
box-shadow: 0px 0px 12px #E8E8ED;
border: 1px solid #D1D6DA;
}
.select-box .options-container.active {
max-height: 240px;
}
#clear-filters > div,
#resultCount,
#sort-disp span {
color: var(--color-black);
}
.products-grid__filter--results > div > div span {
color: var(--color-cheshire);
}
#resultCount {
font-size: 16px;
line-height: 11px;
letter-spacing: -0.4px;
font-weight: 400;
order: 99;
margin-left: auto;
}
#resultCount strong, #resultCount span{
font-weight: 400 !important;
}
#resultCount strong{
font-weight: 600 !important;
}
.filter-block__collapsed h3 {
margin-bottom: 0;
}
.filter-block__collapsed h3::after {
transform: rotate(0deg);
}
.filter-block__collapsed h3 ~ .ls-category__filter-block__inner {
display: none;
}
.filter-display__application .ls-category__filter-block__inner {
display: grid;
grid-template-columns: minmax(auto, 193px) minmax(auto, 193px);
row-gap: 12px;
column-gap: 24px;
}
.filter-display__application label {
padding: 16px;
line-height: 16px;
background: transparent;
outline: 0.5px solid #D1D6DA;
transition: outline 0.3s ease-in-out;
}
.filter-display__application label:hover {
outline: 0.5px solid var(--color-cheshire);
}
.filter-display__application label:has(input:checked) {
outline: 2px solid var(--color-cheshire);
}
.filter-display__application label > span:first-child {
padding-left: 32px;
}
.filter-display__application label span:first-child > span,
.filter-display__application label span:first-child > span img {
width: 24px;
height: 24px;
}
.filter-display__application label span:first-child > span {
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
}
.filter-display__application input {
position: absolute;
top: 0;
left: 0;
}
.ls-category__filter-disabled span {
color: var(--color-silver);
}
.products-grid__no-filters div {
display: none;
}
.category-title-split {
display: block;
}
#fp\.wp\.marker-bottom {
display: none; /* without this rule this element has a margin-top and adding a big gap between product grid and category copy */
}
.filter__products-grid.no-filter-results {
display: block !important;
}
.filter__products-grid.no-filter-results::before {
content: "No products match the currently selected filters.";
display: block;
}
.ls-product-grid-container {
display: grid;
row-gap: 16px;
column-gap: 32px;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.ls-product-item,
.product-listing-feature,
.ls-ad-box {
position: relative;
}
.ls-product-item {
display: flex;
flex-direction: column;
}
.ls-product-item .ls-product-img{
transition: border 0.3s ease-in-out;
}
.ls-product-item:hover .ls-product-img{
border-bottom: 4px solid #C09A5F;
}
.ls-product-grid-link {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
cursor: pointer;
z-index: 10;
}
.ls-ad-box .ls-product-grid-link {
z-index: 3;
}
.ls-product-item .ls-product-img {
position: relative;
margin-bottom: 16px;
border-bottom: 4px solid white;
background: #f7f7f7;
}
@media (min-width: 1024px) {
.ls-product-item .ls-product-img {
margin-bottom:32px;
}
}
.ls-product-item .ls-product-img picture + picture {
margin-top: 0;
}
.ls-product-item .ls-product-img img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
aspect-ratio: 331 / 331;
mix-blend-mode: multiply;
}
.ls-product-item .ls-product-img .ls-product-swatch-controls,
.ls-product-item .ls-product-img .ls-product-swatch-dots {
width: 100%;
position: absolute;
left: 0;
z-index: 12;
display: flex;
align-items: center;
}
.ls-product-item .ls-product-img .ls-product-swatch-controls {
top: 50%;
transform: translateY(-50%);
justify-content: space-between;
}
.ls-product-item .ls-product-img .ls-product-swatch-dots {
bottom: 20px;
gap: 3px;
justify-content: center;
}
.ls-product-item .ls-product-img .ls-product-swatch-controls > span {
display: inline-block;
width: 24px;
height: 24px;
background: url("/media/skin/icons/hub_chevron_right_white.svg") no-repeat 50% 50%;
background-size: 100%;
position: absolute;
top: 50%;
transform: translateY(-50%);
transition: opacity 0.3s ease-in-out;
opacity: 0.6;
cursor: pointer;
}
.ls-product-item .ls-product-img .ls-product-swatch-controls > span:hover,
.ls-product-item .ls-product-img .ls-product-swatch-controls > span:focus {
opacity: 1;
}
.ls-product-item .ls-product-img .ls-product-swatch-controls > span::before {
content: "";
width: 48px;
height: 48px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.ls-product-item .ls-product-img .ls-product-swatch-controls > span:first-child {
left: clamp(18px, 2.5vw, 28px);
transform: translateY(-50%) rotate(180deg);
display: none;
}
.ls-product-item .ls-product-img .ls-product-swatch-controls > span:last-child {
right: clamp(18px, 2.5vw, 28px);
}
.ls-product-item .ls-product-img .ls-product-swatch-dots > span {
width: 5px;
height: 5px;
background: rgba(255, 255, 255, 0.5);
border-radius: 100%;
cursor: pointer;
}
.ls-product-item .ls-product-img .ls-product-swatch-dots > span.clicked {
background: var(--color-white);
}
.ls-product-item .ls-product-img-swatch,
.ls-product-item .ls-product-img.active .ls-product-img-original,
.ls-product-item .ls-product-img .ls-product-swatch-controls > span:first-child,
.ls-product-item .ls-product-img.active .ls-product-swatch-controls > span:last-child {
display: none;
}
.ls-product-item .ls-product-img.active .ls-product-img-swatch {
display: block;
}
.ls-product-item .ls-product-img.active .ls-product-swatch-controls > span:first-child {
display: inline-block;
}
.ls-product-rating > span:first-child {
display: inline-block;
width: 16px;
height: 16px;
background: url("/media/skin/icons/rating.svg") no-repeat 50% 50%;
background-size: 100%;
}
.ls-product-name-rating {
display: flex;
justify-content: space-between;
gap: 8px;
}
.ls-product-name {
font-size: clamp(16px,1.4vw,20px);
line-height: 14px;
font-weight: 600;
letter-spacing: -0.5px;
margin-bottom: 16px;
text-align: center;
}
.ls-product-name h3,
.fs-clamp .ls-product-name h3 {
font-family: var(--font-text-medium);
font-size: clamp(16px, 1.4vw, 20px);
line-height: 20px;
font-weight: 600;
letter-spacing: 0;
color: var(--color-black);
}
.ls-product-name h3 span,
.fs-clamp .ls-product-name h3 span {
font-family: var(--font-text-regular);
color: var(--color-emperor);
}
.ls-product-name a span {
display: block;
}
.ls-product-rating {
display: flex;
align-items: center;
align-self: flex-start;
gap: 8px;
display: none;
}
.ls-rating-score {
color: var(--color-emperor);
}
.ls-product-info {
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.ls-product-item .price-box {
color: #4E5252;
font-size: clamp(12px,1.4vw,20px);
line-height: clamp(14px,1.4vw,28px);
font-weight: 400 !important;
letter-spacing: -0.5px;
margin-bottom: 16px;
margin-top: 0;
text-align: center;
}
@media (min-width: 1024px){
.ls-product-item .price-box {margin-bottom: 32px;}
}
.ls-product-item .price-box.sale{
margin-bottom:16px;
}
.ls-product-item .ls-grid-price {
font-family: var(--font-text-regular);
font-size: clamp(12px, 1.4vw, 20px);
line-height: 14px;
letter-spacing: -0.5px;
font-weight: 500;
color: var(--color-emperor);
margin: 0;
}
.ls-product-item .ls-grid-price-wrapper-sale{
justify-content: center;
align-items: center;
flex-direction: column;
gap: 0;
}
.ls-product-item .ls-grid-price-wrapper-sale .ls-grid-price{
font-weight: 400;
}
.ls-product-item .ls-grid-price-wrapper-sale .ls-grid-price-old{
color: var(--color-emperor);
line-height: clamp(20px,3vw,36px);
}
.ls-product-item .ls-grid-price-old ~ .ls-grid-price {
font-family: var(--font-text-medium);
color: #E91D25;
}
.ls-product-item .ls-grid-price-old::before {
border-top: 1px solid var(--color-emperor);
transform: none;
margin: 0 -5px;
width: 110%;
}
.ls-product-item .ls-grid-price-old ~ .ls-grid-price::before{
content: 'NOW: ';
display: inline-block;
}
.ls-product-item .ls-price-prefix {
font-family: var(--font-text-regular);
font-size: 16px;
color: var(--color-emperor);
font-style: normal;
}
.ls-product-stock-status {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: clamp(12px,1vw,16px);
margin-bottom: 16px;
}
.ls-product-stock-status,
.ls-product-stock-status p {
font-family: var(--font-text-regular);
font-weight: 400;
/*font-size: clamp(12px,1vw,16px);*/
font-size:12px;
line-height: 25px;
letter-spacing: 0.6px;
color: var(--color-black);
}
.ls-product-status {
padding: 0 16px;
flex-shrink: 0;
height:25px;
line-height: 25px;
font-weight: 400;
text-transform: uppercase;
}
.ls-in-stock {
color: #fff;
background-color:#268521;
}
.ls-low-stock, .grid-form .delivery-text em.green.ls-low-stock {
color: #D38601;
background: #FBE0B0;
}
.ls-out-of-stock, .grid-form .delivery-text em.green.ls-out-of-stock {
color: #C5312D;
background: #F7DBDB;
}
.ls-in-stock ~ p .ls-delivery-time {
color: var(--color-bread);
}
.ls-low-stock ~ p .ls-delivery-time {
color: var(--color-bread);
}
.ls-delivery-date {
font-family: var(--font-text-medium);
color: var(--color-black);
}
.ls-product-compare {
display: none;
}
.ls-ad-box {
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 16px;
padding: 32px;
background-color: #A2A5A7;
position: relative;
}
.ls-ad-box.trustpilot-feature-banner {
padding: 0;
}
.ls-ad-box.trustpilot-feature-banner .ls-ad-box-top {
padding: 32px 32px 0;
}
.ls-ad-box.img-at-top {
justify-content: flex-end;
}
.box-bg-beige {
background-color: #C9A78E;
}
.box-bg-green {
background-color: #04DA8D;
}
.box-bg-purple {
background-color: #737695;
}
.box-bg-blue {
background-color: #002F87;
}
.box-bg-dark-grey {
background-color: #7D7579;
}
.ls-ad-box,
.ls-ad-box p,
.ls-ad-box strong {
color: var(--color-white);
}
.ls-ad-box p {
font-family: var(--font-display-regular);
font-size: 28px;
line-height: 32px;
letter-spacing: -0.28px;
}
.ls-ad-box p strong {
font-family: var(--font-display-medium);
}
.ls-ad-box.ad-paypal p {
font-family: var(--font-display-medium);
font-size: 24px;
line-height: 32px;
letter-spacing: -0.24px;
}
.ls-ad-box.ad-paypal p:last-child {
font-family: var(--font-text-regular);
font-size: 16px;
line-height: 24px;
letter-spacing: -0.08px;
}
.ls-ad-box.trustpilot-feature-banner p {
font-family: var(--font-text-regular);
font-size: 24px;
line-height: 32px;
letter-spacing: -0.12px;
}
.ls-ad-box picture,
.ls-ad-box picture img {
width: 100%;
position: absolute;
left: 0;
bottom: 0;
z-index: 1;
min-height: 100px;
}
.ls-ad-box picture {
height: 100%;
}
.ls-ad-box picture img {
object-fit: cover;
}
.ls-ad-box.img-at-top picture,
.ls-ad-box.img-at-top picture img {
top: 0;
bottom: auto;
}
.ls-ad-box-top,
.ls-ad-box-bottom {
position: relative;
z-index: 2;
}
.ls-ad-box-top > img {
margin-bottom: 16px;
}
.trustpilot-feature-banner .ls-ad-box-top > img {
margin-bottom: 32px;
}
.ls-ad-box-top p + p {
margin-top: 16px;
}
.ls-ad-box .learn-btn {
max-width: 100%;
}
.product-listing-feature {
container-type: inline-size;
container-name: productFeatureContainer;
overflow: hidden;
width: 100%;
aspect-ratio: 332 / 493;
align-self: stretch;
}
.trustpilot-feature-banner p:first-child,
.trustpilot-feature-banner p span,
.trustpilot-feature-banner .ls-ad-box-bottom,
.trustpilot-feature-banner .ls-ad-box-bottom p {
color: var(--color-black);
}
.trustpilot-feature-banner .ls-ad-box-bottom {
padding: 20px 32px;
background-color: var(--color-white);
display: flex;
justify-content: space-between;
align-items: center;
gap: 16px;
border: 1px solid #04DA8D;
}
.ad-samplebox picture img {
height: 75%;
}
@container productFeatureContainer (max-width: 330px) {
.ls-ad-box {
padding: 16px;
}
.ls-ad-box.trustpilot-feature-banner .ls-ad-box-top {
padding: 16px 16px 0;
}
.ls-ad-box p {
font-size: 24px;
line-height: 28px;
}
.ls-ad-box .learn-btn {
font-size: 14px;
padding: 8px;
}
.trustpilot-feature-banner .ls-ad-box-bottom {
padding: 16px;
}
.trustpilot-feature-banner .ls-ad-box-bottom > img:last-child {
width: 70px;
margin-top: 3px;
}
}
@media(max-width: 480px){
.ls-category__filter-block h3, .fs-clamp .ls-category__filter-block h3, .ls-category__filter-block label, .ls-checkbox label, .dynamic-sizes .products-grid__filters-buttons .remove-main-btn-styles{
font-weight: 400;
}
}
/* end product listing page */
/* marketing tags */
.ls-grid-mtag {
font-family: var(--font-text-regular);
font-size: 12px;
line-height: 20px;
letter-spacing: -0.06px;
text-align: center;
text-transform: none;
color: var(--color-white);
border-radius: 0;
display: block;
padding: 0 14px;
width: auto;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}
.ls-grid-mtag.new-tag {
border-radius: 0;
}
/* end marketing tags */
/* search results page */
.search-result-container .search.results {
margin-top: clamp(52px, 6vw, 100px);
}
/* end search results page */
/* 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-cheshire);
}
.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);
}
/* end table styles on category page */
@media (max-width: 419px) {
/* search block/form */
.search-block input {
width: 186px;
}
/* end search block/form */
/* porcelain hub page */
.good-points-container .hub-list li {
align-items: flex-start;
}
.good-points-container .hub-triangle {
position: relative;
top: 5px;
}
/* end porcelain hub page */
/* product listing page */
.filter-display__colour .ls-category__filter-block__inner {
grid-template-columns: 1fr;
}
/*.product-listing-container-column{*/
/* margin-top: 40px;*/
/* padding-top: 40px;*/
/* border-top: 1px solid var(--color-cheshire-grey);*/
/*}*/
/* end product listing page */
}
@media (min-width: 420px) {
/* image with text banner */
.with-overshooting-img,
.dynamic-sizes > div + div.with-overshooting-img {
margin-top: 16%;
}
.with-overshooting-img picture {
margin-top: -10%;
}
/* end image with text banner */
/* banner with text */
.banner-text .mobile-img img {
object-position: 50% 50%;
}
.banner-text--text > p {
max-width: 100%;
}
/* end banner with text */
/* product listing page */
/*.product-listing-container-column {*/
/* margin-top: 24px;*/
/*}*/
.filter-swatches-controls {
gap: 24px;
}
/* end product listing page */
}
@media (max-width: 479px) {
/* trustpilot widget */
.trustpilot-review .review-text p {
max-width: 233px;
}
/* end trustpilot widget */
/* search block/form */
.search-block input.mobile-shrink {
width: 157px;
}
/* end search block/form */
}
@media (max-width: 460px) {
/* product listing page */
.main-product-filter-container .select-box {
font-size: 12px;
}
.main-product-filter-container .select-box .option,
.main-product-filter-container .selected {
padding: 12px 16px 0;
}
/* end product listing page */
}
@media (max-width: 550px) {
.select-box.display-always{
flex-direction: column;
gap: 24px;
align-items: flex-start;
}
}
@media (min-width: 480px) {
/* banner with text */
.banner-text .mobile-img {
display: none;
}
.banner-text .desktop-img {
display: block;
}
.banner-text .desktop-img img {
object-position: 0% 100%;
}
.banner-text--text {
padding: 35px 32px 179px;
}
.banner-text--text > p {
max-width: 456px;
}
/* end banner with text */
/* trustpilot widget */
.trustpilot-score {
max-width: 100%;
margin-left: 0;
margin-right: 0;
}
/* end trustpilot widget */
/* product listing page */
.ls-product-grid-container {
grid-row-gap: 32px;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
/* end product listing page */
}
@media (min-width: 420px) and (max-width: 767px) {
/* image with text banner */
.center-ontablet {
margin-left: auto;
margin-right: auto;
}
/* end image with text banner */
}
@media (max-width: 767px) {
/* general */
.word-new-line-mobile > span {
display: block;
}
/* end general */
/* image with text banner */
.image-text-banner {
background: var(--color-background-main);
}
/* end image with text banner */
/* text with slider block */
.texton-img .texton-img-grid p strong {
font-family: var(--font-text-regular);
}
/* end text with slider block */
/* porcelain hub page */
.people-text .text {
padding: 16px 16px 24px;
}
.people-text .media {
order: 2;
margin-top: 0;
}
/* end porcelain hub page */
}
@media (min-width: 768px) {
/* text with video */
.text-video {
grid-template-columns: 1fr 1fr;
}
/* end text with video */
/* image with text banner */
.image-text-banner {
grid-template-columns: 1fr 1fr;
overflow: hidden;
}
.image-text-banner .image-text-banner--text,
.image-text-banner .image-text-banner--text::before {
background: var(--color-background-main);
}
.image-text-banner .image-text-banner--text::before {
content: "";
width: 100vw;
height: 100%;
position: absolute;
top: 0;
right: 100%;
z-index: -1;
}
.with-overshooting-img,
.dynamic-sizes > div + div.with-overshooting-img {
margin-top: 7%;
}
.with-overshooting-img picture {
margin-top: 0;
}
.center-ontablet {
text-align: center;
}
/* end image with text banner */
/* text with slider block */
.texton-img::before {
background: linear-gradient(10deg, rgba(0, 0, 0, 0.5), transparent 40%);
}
.texton-img .texton-img-grid {
gap: 20.87px;
bottom: 32px;
}
.texton-img.with-titles .texton-img-grid {
bottom: 32px;
}
.texton-img.with-titles .texton-img-grid > div {
gap: 16px;
}
.texton-img-title {
padding-left: 27px;
}
.flower-show-carousel .texton-img-grid .texton-img-triangle {
margin-top: 11px;
}
/* end text with slider block */
/* testimonial block */
.ls-testimonial {
display: grid;
grid-template-columns: 0.5fr 1.5fr;
gap: clamp(16px, 3.5vw, 64px);
padding-top: 32.97px;
padding-bottom: 34px;
}
.ls-testimonial > .ls-testimonial-people {
text-align: right;
margin-bottom: 0;
}
.dynamic-sizes .ls-testimonial-people h2,
.ls-testimonial-people h2 {
line-height: 1.333;
letter-spacing: -0.24px;
}
.ls-testimonial-people h2 span {
line-height: 24px;
letter-spacing: -0.08px;
}
.read-more-container .testimonial-right-icon {
margin-right: 16.29px;
}
.ls-testimonial-text > p .on-desktop {
display: inline;
}
.ls-testimonial-text .on-mobile {
display: none;
}
.ls-testimonial-text .read-btn {
font-size: 16px;
line-height: 24px;
letter-spacing: -0.08px;
margin-top: 0;
}
/* end testimonial block */
/* trustpilot widget */
.trustpilot-widget-container {
padding: 45px 0 45px 24px;
}
.trustpilot-widget-container > div {
grid-template-columns: 1fr 2fr;
gap: 32px;
align-items: center;
}
.trustpilot-score {
margin-left: 0;
margin-right: 0;
margin-bottom: 0;
}
.mobile-trustpilot {
display: none;
}
.mobile-trustpilot ~ .trustpilot-widget {
display: block;
}
/* end trustpilot widget */
/* showroom search page */
.showroom-featured .showroom-left a {
aspect-ratio: 16 / 9;
}
/* end showroom search page */
/* showroom page */
.showroom-member {
display: grid;
grid-template-columns: 1fr 1fr;
}
.showroom-page .staff-container .member-text h2,
.dynamic-sizes.showroom-page .staff-container .member-text h2 {
margin-bottom: 0;
}
/* end showroom page */
/* porcelain hub page */
.people-text {
grid-template-columns: 0.85fr 1fr;
}
.people-text .media {
text-align: right;
}
.people-text .text {
padding: 24px;
align-self: center;
}
.porcelain-paving-hero picture {
aspect-ratio: 1056 / 379;
}
.porcelain-paving-hero .with-videolink::before {
transform: translate(-50%, -63%);
}
.discover-banner {
max-width: 1328px;
}
.discover-banner picture {
aspect-ratio: 1328 / 160;
}
.discover-banner > div {
flex-direction: row;
align-items: center;
}
.discover-banner h2 span {
display: block;
}
.discover-banner h2,
.fs-clamp .discover-banner h2 {
font-family: var(--font-display-regular);
}
.discover-banner h2 strong,
.fs-clamp .discover-banner h2 strong {
font-family: var(--font-display-medium);
}
.image-with-text-box {
padding-top: 54%;
background: none;
}
.image-with-text-box > picture img {
object-fit: cover;
}
/* end porcelain hub page */
/* product listing page */
.swatches button {
padding: 6px 14px;
}
.ls-product-name h3,
.fs-clamp .ls-product-name h3 {
font-size: 20px;
line-height: 24px;
}
.ls-product-item .ls-grid-price{
font-size: 20px;
line-height: 24px;
}
/* end product listing page */
}
@media (min-width: 768px) and (max-width: 1023px) {
/* porcelain hub page */
.content-trustpilot {
grid-template-columns: 1fr auto;
justify-content: space-between;
align-items: flex-end;
}
.discover-banner h2,
.fs-clamp .discover-banner h2 {
font-size: 20px;
line-height: 1.3em;
}
.discover-banner .learn-btn {
font-size: 14px;
padding: 8px 10px;
}
/* end porcelain hub page */
}
@media (max-width: 1023px) {
/* general */
.mobile-gap,
.vertical-grid-container.mobile-gap {
display: grid;
gap: 32px;
}
/* end general */
/* breadcrumbs */
.hideon-mobile,
.ls-breadcrumbs > span.hideon-mobile,
.product-listing-breadcrumbs .ls-breadcrumbs > span:last-of-type,
.product-listing-breadcrumbs .ls-breadcrumbs > a:not(.breadcrumbs-home):last-of-type {
display: none;
}
/* end breadcrumbs */
/* container goes to the edge of window but only on mobile and tablets */
.content-offset-mobile {
margin-right: -24px;
}
/* container goes to the edge of the window both side but only on mobile and tablets */
.content-offset-bothside-mobile {
margin-left: -24px;
margin-right: -24px;
}
/* showroom search page */
.showroom-featured .showroom-right {
position: relative;
}
.showroom-featured .with-videotour {
position: absolute;
top: 16px;
right: 16px;
}
/* end showroom search page */
/* showroom page */
.facilities-container ul {
max-width: 400px;
}
.showroom-googlemaps-link a {
text-align: center;
}
/* end showroom page */
/* porcelain hub page */
.good-points-container .with-videolink::before {
top: 60%;
transform: translate(-50%, -60%);
}
.good-points-container img {
margin-bottom: -3px;
}
.image-with-text-box {
display: flex;
align-items: flex-end;
}
.text-box {
width: 100%;
}
.text-box p {
max-width: 736px;
}
/* end porcelain hub page */
}
@media (min-width: 860px) {
/* porcelain hub page */
.dynamic-sizes > .people-text.bespoke-porcelain {
margin-top: calc(2.19em + clamp(32px, 7vw, 128px));
}
/* end porcelain hub page */
}
@media (min-width: 1024px) {
/* general */
.ls-redesign {
margin-bottom: 64px;
}
.category-view .ls-redesign {
margin-bottom: 50px;
}
.ls-redesign.ls-no-mt {
margin-top: 0;
}
.ls-redesign.ls-no-mb {
margin-bottom: 0;
}
.dynamic-sizes h1 {
letter-spacing: -0.4px;
}
.dynamic-sizes .subheading-style,
.subheading-style {
font-family: var(--font-display-medium);
line-height: 40px;
}
.dynamic-sizes p,
.dynamic-sizes .remove-main-btn-styles {
letter-spacing: -0.08px;
}
.big-text,
.dynamic-sizes .big-text {
font-family: var(--font-display-regular);
}
.big-text strong,
.fs-clamp p.big-text strong {
font-family: var(--font-display-medium);
}
.dynamic-sizes h2,
.dynamic-sizes .subheading-style,
.subheading-style,
.big-text,
.dynamic-sizes .big-text {
letter-spacing: -0.32px;
}
.no-arrowsonmobile .swiper-button-next,
.no-arrowsonmobile .swiper-button-prev {
display: block;
}
.word-new-line > span {
display: block;
}
.vertical-grid-container {
display: grid;
grid-template-columns: 1fr 2.05fr;
gap: 32px;
}
.desktop-order {
order: 2;
}
.desktop-pright-34 {
padding-right: 34px;
}
/* add max width to offset container to prevent it growing huge on big screens */
.content-offset.fix-forhuge-screens .swiper-pagination,
.content-offset.fix-forhuge-screens .text-with-slider .swiper-pagination {
right: 4%;
}
.content-offset.fix-forhuge-screens .swiper-pagination .swiper-pagination-bullet:last-of-type,
.content-offset.fix-forhuge-screens .text-with-slider .swiper-pagination .swiper-pagination-bullet:last-of-type {
margin-right: 0;
}
/* end general */
/* banner slider */
.ls-slider.ls-banner picture {
aspect-ratio: 1600 / 600;
}
/* end banner slider */
/* search block/form */
.search-block input {
width: 214px;
}
/* end search block/form */
/* heading with text block */
.intro {
display: grid;
grid-template-columns: 1fr 2.05fr;
justify-content: space-between;
gap: 2em;
}
.body-filter-open .intro {
gap: 64px;
}
.intro:not(.smaller-text) p,
.intro:not(.smaller-text) .read-more-container p {
font-family: var(--font-display-medium);
line-height: 1.25;
letter-spacing: -0.32px;
margin-top: 0;
}
/* end heading with text block */
/* call to action block */
.cta-block {
max-width: 1328px;
margin-left: auto;
margin-right: auto;
display: grid;
grid-template-columns: 1fr 2.4fr;
}
.cta-block.bgcolor-grey {
background: var(--color-background-main);
}
/* end call to action block */
/* text with video */
.text-video {
grid-template-columns: 1fr 2.2fr;
}
/* end text with video */
/* image with text banner */
.image-text-banner {
max-width: 1328px;
margin-top: 88px !important;
margin-left: auto;
margin-right: auto;
grid-template-columns: 1fr 2.56fr;
}
/* end image with text banner */
/* text with slider block */
.text-with-slider {
grid-template-columns: 1fr 2.07fr;
}
.text-with-slider .swiper-pagination {
left: auto;
right: 3%;
}
.ls-slider.pagination-outside.three-items {
padding-bottom: 0;
}
.landscape .text-with-slider--text {
padding-right: 32px;
}
/* end text with slider block */
/* testimonial block */
.ls-testimonial {
grid-template-columns: 1fr 2.10fr;
}
.ls-testimonial-people {
margin-top: 30.2px;
}
.ls-testimonial-people picture img {
width: 128px;
}
.ls-testimonial-text {
max-width: 784px;
}
.ls-testimonial-text p {
font-family: var(--font-display-regular);
letter-spacing: -0.32px;
}
.ls-testimonial-text p strong {
font-family: var(--font-display-medium);
}
.ls-testimonial-text > p > span > img {
transform: translateY(-9px);
}
.testimonial-left-icon {
margin-right: 0;
}
.testimonial-right-icon {
margin-left: 0;
}
.read-btn {
gap: 16px;
}
.read-btn .read-icon {
width: 24px;
height: 24px;
}
/* end testimonial block */
/* icons next to each other */
.icons-container ul {
gap: 25px;
row-gap: 16px;
}
/* end icons next to each other */
/* three items slider block */
.three-items {
cursor: default;
}
.three-items picture {
aspect-ratio: 512 / 341;
}
/* end three items slider block */
/* trustpilot widget */
.trustpilot-widget-container.pagination-outside {
margin-bottom: 128px;
}
.trustpilot-widget-container > div {
grid-template-columns: 1fr 2.05fr;
}
.trustpilot-review .review-text {
max-width: 282px;
}
/* end trustpilot widget */
/* banner with text */
.banner-text--text > p {
margin-bottom: 112px;
}
.number-square-text img {
width: 72px;
}
.number-square-text p {
font-size: 24px;
line-height: 32px;
letter-spacing: 1.2px;
}
/* end banner with text */
/* showroom search page */
.map-container {
position: relative;
}
.showroom-search-container {
padding: 16px;
background: var(--color-white);
border-bottom: 0;
position: absolute;
left: 32px;
bottom: 32px;
}
.showroom-search-container > p {
font-family: var(--font-display-medium);
line-height: 32px;
letter-spacing: -0.24px;
}
.showroom-search-container.no-absolute {
padding: 0;
background: transparent;
position: static;
}
h2 ~ .showroom-types {
margin-top: 24px;
}
.showroom-title-container a {
font-family: var(--font-display-medium);
line-height: 32px;
letter-spacing: -0.24px;
}
.showroom-distance,
p.showroom-distance {
line-height: 16px;
}
.ls_showroom_item {
display: grid;
grid-template-columns: 1fr 0.75fr;
gap: 32px;
padding-top: 24px;
padding-bottom: 24px;
}
.ls_showroom_item:first-of-type {
padding-top: 0;
}
.ls_showroom_item .showroom-right {
display: flex;
}
.ls_showroom_item .showroom-desc {
line-height: 24px;
letter-spacing: -0.08px;
}
.with-videotour img {
width: 29px;
}
.with-videotour a {
font-size: 16px;
line-height: 24px;
letter-spacing: -0.08px;
}
.showroom-listing-container {
display: grid;
grid-template-columns: 1fr 3fr;
justify-content: space-between;
gap: 32px;
}
.showroom-featured {
border: 1px solid var(--color-cheshire);
}
.showroom-featured .ls_showroom_item {
grid-template-columns: 240px 1fr;
gap: 0;
}
.showroom-featured .showroom-left a {
aspect-ratio: auto;
}
.showroom-featured .showroom-right {
flex-direction: row;
align-items: center;
gap: 32px;
padding: 2em 2em;
}
.showroom-featured .showroom-location {
flex-wrap: wrap;
justify-content: center;
gap: 9px;
}
.showroom-featured .showroom-location .showroom-distance {
width: 100%;
text-align: center;
}
.showroom-featured .showroom-right .showroom-title-container {
margin-bottom: 12px;
}
.showroom-featured .showroom-title-container a {
gap: 24px;
}
/* end showroom search page */
/* Frazer's showroom map */
#map {
height: 600px;
}
/* end Frazer's showroom map */
/* showroom page */
.get-direction a {
gap: 16px;
}
.showroom-tel {
margin-top: 32px;
}
.data-item {
padding: 32px 0;
}
.showroom-message p {
padding-top: 32px;
}
.showroom-message .data-item {
padding-top: 16px;
}
.data-item.location-block {
display: block;
}
.data-item:not(.not-firstchild):first-of-type {
padding-top: 0;
border-top: 0;
}
.virtual-tour-block p,
.location-block div div p {
max-width: 512px;
}
.opening-block > div {
max-width: 100%;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 32px;
}
.opening-hours {
gap: 32px;
}
.facilities-container ul {
gap: 32px;
}
.staff-container {
padding-bottom: 0;
border-bottom: 0;
}
.showroom-info .left-container,
.staff-container .left-container {
padding-right: 32px;
}
.faq-item {
margin-bottom: 24px;
padding-bottom: 24px;
}
.faq-item .faq-item-header {
gap: 16px;
}
.faq-item .faq-item-header::after {
width: 18px;
height: 16px;
}
.faq-item.open .faq-item-header {
margin-bottom: 24px;
}
.location-block.read-more-active #showroom_map {
margin-top: 32px;
}
/* end showroom page */
/* porcelain hub page */
.hub-video {
aspect-ratio: 1600 / 600;
}
.hub-page__feature-carousel-container.bgcolor-grey {
padding-top: 20px;
}
.hub-page__feature-carousel-container h2 {
padding-top: 12px;
}
.text-with-slider .hub-page__feature-carousel .swiper-pagination {
left: 0;
right: auto;
}
.hub-page__feature-holder {
padding-left: 25px;
padding-right: 25px;
}
.hub-page__feature-holder > div {
padding-top: 42px;
}
.hub-page__feature-heading1,
.hub-page__feature-heading3 {
font-family: var(--font-display-regular);
}
.hub-page__feature-heading2 {
font-family: var(--font-display-medium);
line-height: 40px;
letter-spacing: -0.32px;
margin-top: 14px;
}
.good-points-container {
grid-template-columns: 1fr 1fr;
background-color: var(--color-dawn-pink);
}
.dynamic-sizes > div + div.good-points-container {
margin-top: calc(78px + clamp(32px, 7vw, 128px));
}
.good-points-container .hub-list li {
line-height: 24px;
}
.good-points-container .hub-list li + li {
margin-top: 20px;
}
.good-points-text {
padding: 32px 24px 24px;
}
.good-points-container picture {
aspect-ratio: 860 / 569;
position: absolute;
left: 0;
bottom: 0;
min-height: 100%;
max-width: 100%;
}
.good-points-container picture img {
position: absolute;
bottom: 0;
left: 0;
object-fit: cover;
width: 100%;
height: 113.5%;
object-position: 0 0;
}
.good-points-container a.with-videolink {
height: 100%;
position: relative;
}
.good-points-container .with-videolink::after {
content: "";
position: absolute;
right: -1px;
top: 0;
height: 100%;
width: 8em;
background: linear-gradient(to right, transparent, var(--color-dawn-pink));
}
.hub-page__feature-holder ul {
margin-top: 38px;
}
.hub-page__feature-holder li {
padding: 18px 0;
}
.hub-triangle {
border-top: 6.93px solid transparent;
border-bottom: 6.93px solid transparent;
border-left: 12px solid var(--color-cheshire);
}
.porcelain-paving-hero .with-videolink::before {
transform: translate(-50%, -61%);
}
.people-text .text {
max-width: 678px;
padding: 56.5px;
}
.people-text.bespoke-porcelain .text p {
max-width: 547px;
}
.image-with-text-box {
padding: 32px;
}
.text-box {
width: 50%;
margin-left: auto;
padding: 32px;
}
.text-box::before {
top: 50%;
left: -48px;
transform: translateY(-50%);
border-top: 16px solid transparent;
border-bottom: 16px solid transparent;
border-right: 32px solid var(--color-white);
}
.text-box p {
max-width: 544px;
}
.text-box-to-left .text-box {
margin-left: 0;
margin-right: auto;
}
.text-box-to-left .text-box::before {
left: auto;
right: -32px;
border-left: 32px solid var(--color-white);
border-right: 0;
}
.text-box-title-logo {
display: flex;
justify-content: space-between;
gap: 16px;
}
.text-box-title-logo picture {
order: 2;
flex-shrink: 0;
}
.text-box-title-logo img {
margin-bottom: 0;
}
/* end porcelain hub page */
/* blog post carousel */
.blog-with-text {
grid-template-columns: 1fr 2.07fr;
}
.blog-with-text h2 ~ p {
max-width: 481px;
}
/* end blog post carousel */
/* product listing page */
.has-border-bottom {
padding-bottom: 80px;
}
.ls-category-banner picture {
aspect-ratio: 1600 / 400;
}
.ls-product-grid-container {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}
.ls-product-item .ls-product-img {
margin-bottom: 32px;
}
/* end product listing page */
/* table styles on category page */
.ls-table th:first-child {
min-width: 240px;
}
.ls-table.two-columns th:first-child {
max-width: min(34vw, 240px);
}
/* end table styles on category page */
}
@media (min-width: 1260px) {
/* main menu */
.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 */
/* porcelain hub page */
.discover-banner > div {
padding: 30px;
}
/* end porcelain hub page */
}
@media (min-width: 1260px) and (max-width: 1599px) {
/* porcelain hub page */
.people-text .media {
margin-top: -10%;
}
/* end porcelain hub page */
}
@media (max-width: 1279px) {
/* product listing page */
.main-product-filter-container.filter-open .filter-shadow-modal {
visibility: visible;
opacity: 1;
}
.products-grid__filter--holder {
max-width: 480px;
width: 100%;
min-height: 100vh;
/* border-left: 0.5px solid var(--color-emperor);
border-right: 0.5px solid var(--color-emperor);
border-bottom: 0.5px solid var(--color-emperor); */
background: #F9FAFA;
/* position: absolute; */
position: fixed;
top: 0;
left: 0;
z-index: 2100;
}
.products-grid__filters {
max-height: calc(100vh - 140px);
overflow: hidden;
overflow-y: auto;
}
.controls-of-filter-popup .close-product-filter,
.main-product-filter-container.filter-open .controls-of-filter-popup .close-product-filter {
display: none;
}
.products-grid__filter--header {
padding: 13px 24px;
background: var(--color-white);
border-top: none;
border-bottom: 4px solid #C09A5F;
}
.products-grid__filter--header p {
font-family: var(--font-text-medium);
width: 145px;
height: 46px;
border: 1px solid #C4CCCE;
border-bottom: 4px solid #C09A5F;
font-size: 16px;
line-height: 20px;
letter-spacing: -0.4px;
font-weight: 500;
color: var(--color-black);
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
}
.category-page-title-container .sort-swatches > div:first-child {
display: flex;
gap: 24px;
max-width:312px;
}
.category-page-title-container .sort-swatches > div:first-child > div {width:100%;}
.controls-of-filter-popup ~ #productSort {
width: 100%;max-width: 168px;
}
/* end product listing page */
}
@media (min-width: 1280px) {
/* product listing page */
.product-listing-container,
.filter-swatches-controls {
grid-template-columns: 1fr 3.08fr;
gap: 64px;
}
.product-listing-container .filter-btn-style{
width: 397px;
height: 60px;
justify-content: flex-start;
padding-left: 24px;
}
#sort-disp {
width: 187px;
height: 60px;
line-height: 16px;
padding-left: 16px;
}
.select-box .options-container{
max-width: 187px;
top: 60px;
}
.main-product-filter-container.filter-open .product-listing-container,
.main-product-filter-container.filter-open .filter-swatches-controls {
grid-template-columns: 397px 1fr;
}
.products-grid__filter--header {
display: none;
}
.controls-of-filter-popup .close-filter-btn {
padding: 24px;
background: transparent;
}
.swatches button {
padding: 6px 16px;
}
.products-grid__filters-buttons {
display: none;
}
.filter-display__brand label span:first-child::before,
.ls-checkbox label span:first-child::before {
top: 50%;
}
.filter-display__colour .ls-category__filter-block__inner {
column-gap: 24px;
}
.controls-of-filter-popup .close-filter-btn {
padding-left: 32px;
padding-right: 32px;
}
.ls-category__filter-block {
margin-bottom: 32px;
padding-bottom: 32px;
}
.filter-block__collapsed {
padding-bottom: 0;
}
.ls-category__filter-block h3 {
margin-bottom: 32px;
}
.ls-category__filter-block h3::before {
height: calc(100% + 30px);
top: -15px;
}
.ls-category__filter-block label,
.ls-checkbox label {
letter-spacing: -0.08px;
}
.ls-category__filter-block label input,
.ls-checkbox label input {
margin-right: 23px;
}
.filter-display__brand label span:first-child::before,
.ls-checkbox label span:first-child::before {
width: 24px;
height: 24px;
background-size: 24px 24px;
}
.filter-display__brand label:has(input:hover) span:first-child::before,
.ls-checkbox label:has(input:hover) span:first-child::before{
background-size: 24px 24px;
}
.filter-display__brand label:has(input:checked) span:first-child::before,
.ls-checkbox label:has(input:checked) span:first-child::before {
background-size: 24px 24px;
}
.filter-display__colour label input {
margin-right: 63px;
}
.filter-display__colour label span:first-child {
padding: 18px 0;
display: flex;
align-items: center;
}
.filter-display__colour label span:first-child > span {
width: 60px;
height: 60px;
}
.filter-display__colour label:not(.ls-category__filter-disabled):hover span:first-child > span,
.filter-display__colour label:not(.ls-category__filter-disabled):has(input:checked) span:first-child > span {
transform: translateY(-50%) scale(0.83);
}
.products-grid__filter--results {
/*margin-bottom: 32px;*/
}
.products-grid__filter--results,
.products-grid__filter--results > div {
column-gap: 24px;
}
.filter-display__application .ls-category__filter-block__inner {
row-gap: 16px;
column-gap: 30px;
}
.filter-display__application label {
padding: 16px;
}
.filter-display__application label > span:first-child {
padding-left: 48px;
}
.filter-display__application label span:first-child > span,
.filter-display__application label span:first-child > span img {
width: 32px;
height: 32px;
}
.filter-display__application label input {
margin-right: 34px;
}
.sort-swatches {
display: grid;
gap: 8px;
}
#show_swatches_mobile {
display: none;
}
#show_swatches_desktop {
display: flex;
justify-self: flex-end;
}
.ls-product-grid-container {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}
.filter-open .ls-product-grid-container {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}
/* end product listing page */
/* heading with text block on category page */
.category-price-container {
align-items: flex-start;
}
.category-price-container span {
margin-top: 0;
}
.category-page-title-mobile {
display: none;
}
.category-page-title-desktop,
.category-page-title-container .intro.category-page-title-desktop {
display: block;
}
/* end heading with text block on category page */
}
@media (min-width: 1300px) {
/* testimonial block */
.hub-page__feature-carousel-container {
padding-right: 24px;
}
.ls-testimonial {
grid-template-columns: 1fr 2.20fr;
}
.body-filter-open .ls-testimonial {
grid-template-columns: 1fr 2.05fr;
}
/* end testimonial block */
/* showroom page */
.data-item {
display: grid;
grid-template-columns: 1fr 1fr;
}
.data-item.location-block > div {
display: grid;
grid-template-columns: 1fr 1fr;
}
/* showroom page */
/* porcelain hub page */
.hub-page__feature-popular__banner {
top: -11%;
}
/* end porcelain hub page */
}
@media (min-width: 1600px) {
/* general */
/* container goes to the edge of window */
.ls-redesign{
padding: 0;
}
.content-offset {
margin-right: calc(-0.5 * (100vw - 1552px));
}
.category-page-title-container .intro>h1 {
letter-spacing: -1px;
}
#sort-disp {
max-height: 64px;
line-height: 11px;
padding: 24px;
}
.porcelain-outside-carousel.fix-forhuge-screens.content-offset,
.flower-show-carousel.fix-forhuge-screens.content-offset {
margin-right: calc(-0.5 * (100vw - 1617px));
}
/* container goes to the edge of window both side */
.content-offset-bothside {
margin-left: calc(-0.5 * (100vw - 1552px));
margin-right: calc(-0.5 * (100vw - 1552px));
}
.fix-forhuge-screens {
overflow: hidden;
}
.fix-forhuge-screens .swiper {
overflow: visible;
margin-left: 0;
}
/* end general */
/* banner slider */
.ls-slider:not(.pagination-outside) .swiper-pagination {
left: -13.8%;
}
.ls-slider.individual-showroom:not(.pagination-outside) .swiper-pagination {
left: -14.3%;
}
/* end banner slider */
/* text with slider block */
.text-with-slider .swiper-pagination {
right: 14.5%;
}
.texton-img h3 {
font-family: var(--font-display-medium);
line-height: 32px;
letter-spacing: -0.24px;
}
.texton-img.with-titles p {
display: block;
}
/* end text with slider block */
/* trustpilot widget */
.trustpilot-widget-container {
padding-right: 24px;
}
/* end trustpilot widget */
/* showroom search page */
.showroom-listing-container {
grid-template-columns: 1fr 2.075fr;
}
.ls_showroom_item {
grid-template-columns: 1fr 1fr;
gap: 0;
}
.ls_showroom_item .showroom-left {
gap: 3.7em;
}
.showroom-featured .showroom-right {
padding: 32px;
}
/* end showroom search page */
/* showroom page */
.showroom-member {
grid-template-columns: 240px 1fr;
}
.showroom-member > div:last-child {
padding: 24px 32px 40px;
}
/* end showroom page */
/* porcelain hub page */
.hub-page__feature-carousel,
.ls-slider.pagination-outside.hub-page__feature-carousel {
padding-bottom: 32px;
}
.content-trustpilot {
grid-template-columns: 1fr auto;
justify-content: space-between;
align-items: flex-end;
}
.people-text .text {
padding: 50px 56.5px;
}
.people-text.bespoke-porcelain .text {
padding-left: 32px;
}
.people-text.porcelain-slabs .text {
padding: 119px 68px 119px 83px;
}
.dynamic-sizes > div + div.good-points-container:not(.porcelain-hub-good-points) {
margin-top: clamp(45px, 7vw, 128px);
}
.dynamic-sizes > div + div.good-points-container.porcelain-hub-good-points {
margin-top: 178px;
}
.good-points-container .with-videolink::after {
display: none;
}
.good-points-text {
padding: 53px 32px 61px;
}
/* end porcelain hub page */
/* blog post carousel */
.cms-page__blog-text {
padding: 20px 32px 32px;
}
.cms-page__blog-text__date {
font-family: var(--font-display-medium);
line-height: 16px;
letter-spacing: 3.6px;
margin-bottom: 4px;
}
.cms-page__blog-text__heading .hub-triangle {
left: -32px;
border-top: 9px solid transparent;
border-bottom: 9px solid transparent;
border-left: 16px solid var(--color-cheshire);
}
.cms-page__blog-text__heading a {
font-family: var(--font-display-medium);
line-height: 32px;
letter-spacing: -0.24px;
}
.blog-post-carousel-container .swiper-button-next,
.blog-post-carousel-container .swiper-button-prev {
display: flex;
}
.blog-post-carousel-container .swiper-pagination-bullets.swiper-pagination-horizontal {
text-align: right;
}
/* end blog post carousel */
/* product listing page */
.product-listing-breadcrumbs{
padding: 0;
}
.main-product-filter-container{
padding: 0;
}
.body-filter-open .main-product-filter-container.filter-open .product-listing-container,
.body-filter-open .main-product-filter-container.filter-open .filter-swatches-controls {
grid-template-columns: 1fr 3.08fr;
}
.body-filter-open .main-product-filter-container.filter-open .product-listing-container>div:first-child{
width: 397px;
}
#sort-disp{
width: 187px;
}
.ls-product-grid-container {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}
.filter-open .ls-product-grid-container {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}
/* end product listing page */
}
@media (min-width: 1648px) {
/* general */
.content-offset.fix-forhuge-screens .swiper-pagination,
.content-offset.fix-forhuge-screens .text-with-slider .swiper-pagination {
max-width: 1057px;
width: 100%;
left: 0;
right: auto;
text-align: right;
}
/* end general */
/* table styles on category page */
.ls-dots-container {
display: none;
}
/* end table styles on category page */
}
/*Porcelain intermediary page*/
.intro.grid-content h2 { margin-top:0.875em;}
.category-porcelain-paving .master-wrapper { overflow-y: clip;overflow-x: clip}
.grid-content{display: grid;flex-direction: column;grid-template-columns: repeat(12, 1fr);column-gap: 0px;}
/*body.cms-porcelain-paving-intermediary- .master-wrapper{ overflow-x: revert;}*/
.intro.grid-content{ display: block;}
@media (min-width: 400px) {
.intro.grid-content br {display: none;}
}
@media (min-width: 768px) {
.grid-content {
column-gap: 32px;
}
.intro.grid-content{ display: grid;
grid-template-columns: repeat(12, 1fr);
grid-template-rows: 1fr;
grid-column-gap: 24px;
grid-row-gap: 0px;}
.intro.grid-content h1 { grid-area: 1 / 1 / 2 / 5;margin:0;}
.intro.grid-content h2 {grid-area: 1 / 5 / 2 / 13;margin:0;}
.intro.grid-content br {display: none;}
.ls-banner.cms-pi{
margin-top:60px !important;
}
}
@media (min-width: 1200px) {
.intro.grid-content br {display: inline;}
.intro.grid-content{ grid-column-gap: 32px;}
}
.ls-breadcrumbs { font-family: var(--font-text-regular);display: flex;;
font-size: 10px;
line-height: 1.6;
letter-spacing: 2px;
color: var(--color-emperor);
letter-spacing: 2px;
text-transform: uppercase;
text-decoration: none;}
.breadcrumbs ul li:not(:last-child) a:after { content: "\002F";margin: 0 10px;}
/*.dynamic-sizes h1 { line-height: clamp(38px, 4vw, 48px);}*/
/*.dynamic-sizes h1 br { display: none}*/
@media (min-width: 768px) {
/*body p, body .dynamic-sizes p, ul{ font-size: 16px;}*/
.dynamic-sizes h1 br { display: inline}
}
body.new-h strong{ font-family: inherit;}
@media (min-width: 1024px) {
.intro h2 {
margin:0;
}
}
.ls-banner.cms-pi picture img { width:100%;max-width: none;aspect-ratio: auto;}
/*.grid-content.ls-product-banner-cont{ margin-top:49px;}*/
.ls-product-banner {
grid-column: 1 / 13;
margin: 0;
background-image: -webkit-image-set(
url('https://d3przyomkgkv0c.cloudfront.net/fit-in/520x156/mediadev/media/cms-pages/1040x312_Jura Image_2x.png') 1x,
url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/1040x312_Jura Image_2x.png') 2x);
background-position: 34% 0;
background-repeat: no-repeat;
background-color:#eee;
cursor: pointer;
/*margin-top:clamp(50px, 5vw, 80px) !important;*/
}
.ls-product-banner div{ display: flex;flex-direction: column;}
.ls-product-banner div picture{ margin:-18px 0 18px 18px;}
.ls-product-banner div h2{ color:#555;margin:0 18px 18px;font-size:16px;font-size: clamp(1.3rem, 0.6087rem + 1.7391vw, 2rem);line-height:24px;}
.ls-product-banner div h2 a{ color:#555;}
.ls-product-banner div h2 a::after{
content:'';
background: transparent url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/hub_chevron_right.svg') no-repeat right center;
background-size: 16px 16px;
height: 16px;
width: 16px;
margin-left:3px;
display: inline-block;
}
@media (min-width: 400px) {
.ls-product-banner div h2 a::after{ margin-left: 12px;}
}
.ls-product-banner div:hover h2 a:after{
background-image: url('https://d3przyomkgkv0c.cloudfront.net//mediadev/media/icons/hub_chevron_right_black.svg');
}
.ls-product-banner div h2 strong{ display: block;color:#000;font-family: var(--font-display-medium)}
.ls-product-banner div span{ color:#000;}
@media (min-width: 520px) {
.ls-product-banner {
grid-column: 1 / 13;
background-image: -webkit-image-set(
url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/jura-beige-721.jpg') 1x,
url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/jura-beige-721@2x.jpg') 2x);
background-size: auto;
background-position: top right;
background-repeat: no-repeat;
border-left:32px solid var(--site-background-color);
}
.ls-product-banner div {
display: flex;
flex-direction: row;
align-items: center;
}
.ls-product-banner div picture {
margin: 16px 0;
position: relative;
left:-32px;
}
.ls-product-banner div h2 {
color: #555;
margin: 0;
line-height:24px;
}
.ls-product-banner div h2 a::after{
background-size: 24px 24px;
height: 24px;
width: 24px;
margin-left: 18px;
position: relative;
top: 7px;
}
.ls-product-banner div strong {
display: block;
color: #000;
}
.ls-product-banner div span {
color: #000;
}
}
@media (min-width: 768px) {
.ls-product-banner {
grid-column: 2 / 12;
}
.ls-product-banner div h2 {
line-height:32px;
color: #555;
}
.ls-product-banner div h2 a::after{
top: 5px;
}
}
@media (min-width: 1000px) {
.ls-product-banner div h2 {
line-height:40px;
}
}
@media (min-width: 1280px) {
.ls-product-banner {
background-image: -webkit-image-set(
url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/jura-beige-8724.jpg') 1x,
url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/jura-beige-8724@2x.jpg') 2x);
min-height: 168px;
}
.ls-product-banner > div {min-height: 168px;}
.ls-product-banner div h2 {
line-height:40px;
}
.ls-product-banner div h2 a::after{
top:0;
}
}
@media (min-width: 1346px) {
.ls-product-banner {
/* background-image: -webkit-image-set(*/
/* url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/jura-beige-721.jpg') 1x,*/
/* url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/jura-beige-721@2x.jpg') 2x);*/
background-size: auto;
background-position: top right;
background-repeat: no-repeat;
width: auto;
}
}
@media (min-width: 1600px) {
.ls-product-banner {
background-image: -webkit-image-set(
url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/jura-beige-bg-desktop.jpg') 1x,
url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/jura-beige-bg-desktop@2x.jpg') 2x);
}
}
.browse-help { flex-direction: column;}
.browse-help div { display: flex;flex:0 0 auto;flex-direction: column}
.browse-help h2{ margin-bottom:32px;line-height:normal;}
.browse-help h2 br{ display: none}
.browse-help h4{ font-weight: normal;padding-left:55px;margin-bottom:23px;
background-image: -webkit-image-set(
url('https://d3przyomkgkv0c.cloudfront.net/fit-in/43x32/mediadev/media/cms-pages/icon-shopping-help.png') 1x,
url('https://d3przyomkgkv0c.cloudfront.net/fit-in/86x64/mediadev/media/cms-pages/icon-shopping-help.png') 2x);background-repeat: no-repeat}
.browse-help h4:last-child{ margin-bottom:0;padding-left:55px;background-position: 11px 0;background-image: -webkit-image-set(
url('https://d3przyomkgkv0c.cloudfront.net/fit-in/21x32/mediadev/media/cms-pages/icon-showroom.png') 1x,
url('https://d3przyomkgkv0c.cloudfront.net/fit-in/42x64/mediadev/media/cms-pages/icon-showroom.png') 2x);}
.browse-help a{ color:#555;font-weight: normal;display: block;font-family:var(--font-text-regular)}
.mt60{ margin-top: clamp(32px, 4vw, 60px) !important;}
.mt32{ margin-top: clamp(32px, 5vw, 80px) !important;}
.specs{ display: flex;margin: 0 auto;height: 200px;}
.specs li{ margin:26px 0 0;text-align: center}
.specs li img{ display: block;margin:0 auto;}
.specs li span{ margin-top:23px;display: block}
.specs li a{ color:#555;}
.specs li a:hover{ text-decoration: underline;}
/*.spec-swiper-cont .swiper-pagination-bullets.swiper-pagination-horizontal{ position: relative;bottom: 24px;text-align: left}*/
/*.spec-swiper-cont .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{background-color:#D4D4D4;border-color:#D4D4D4;opacity: 1;width:0.75em;height:0.75em;}*/
/*.spec-swiper-cont .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color:#E59804;border-color:#E59804;}*/
.swiper-grey-pagination-cont { margin-top:16px !important; }
.swiper-grey-pagination-cont .swiper-pagination { position: static;text-align: left;height:12px;display: flex;}
@media (min-width: 630px) {
.browse-help h2 br{ display: inline;}
.browse-help div{ flex-direction: row;}
.browse-help h4:first-child{ margin-right: 78px}
.browse-help h4:last-child{ background-position: 22px 0;}
}
/*@media (min-width: 1180px) {*/
@media (min-width: 768px) {
.browse-help h2 br{ display: none;}
.browse-help { display: flex;justify-content: space-between;align-items: baseline;/*margin-top:60px !important;*/flex-direction: row;column-gap: 24px;}
.browse-help div { display: flex;flex-grow:0;flex-direction: column;flex-basis:54%;}
.browse-help h2{margin-bottom:0;flex-basis: 41%;}
.browse-help h4{ padding-left:70px;margin-right:78px;font-family: var(--font-text-medium) !important;align-self:end;background-image: -webkit-image-set(
url('https://d3przyomkgkv0c.cloudfront.net/fit-in/54x40/mediadev/media/cms-pages/icon-shopping-help.png') 1x,
url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/icon-shopping-help.png') 2x);background-repeat: no-repeat}
.browse-help h4:last-child{ padding-left:70px;margin-right:0;background-position: 17px 0;background-image: -webkit-image-set(
url('https://d3przyomkgkv0c.cloudfront.net/fit-in/27x40/mediadev/media/cms-pages/icon-showroom.png') 1x,
url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/icon-showroom.png') 2x); }
.browse-help a{ font-weight: normal;display: block;font-family: var(--font-text-regular) !important;}
.stripe-features div.sticky-content{ margin-top:0;}
.stripe-features div.sticky-content p{ width: 577px;}
}
@media (min-width: 1280px) {
.browse-help div { flex-direction: row;justify-content: flex-end;flex-grow: 1;flex-basis: auto;}
.browse-help h4 { align-self: auto;}
.browse-help h4:first-child { margin-right:40px;}
.browse-help h4:last-child { padding-left:42px;background-position: 0 0;}
.stripe-features div.sticky-content p{ width: auto;}
}
@media (min-width: 1600px){
.specs li { flex-grow:1;flex-basis: 13.66%;}
.specs li:first-child { flex-basis:9%;text-align: left;}
.specs li:first-child img { margin:0 auto 0 0}
.specs li:last-child { flex-basis:9%;text-align: right}
.specs li:last-child img { margin: 0 0 0 auto;}
.specs li:last-child span { margin-right:5px;}
}
.stripe-features{ display: flex;flex-direction:column;justify-content: space-between;gap:0;width:100%;}
.stripe-features div.sticky-content{
z-index:20;
/*margin-top: 30px;*/
opacity: 1 !important;
}
.stripe-features .sticky-content.fade-in{
visibility: visible;
opacity: 1 !important;
transition-delay: 0ms;
}
.stripe-features .sticky-content.fade-out{
visibility: visible;
opacity: 0 !important;
transition-delay: 0ms;
}
.features-table-container{
overflow-x:initial;
max-width: 100%;
}
.features-table{
display: flex;
flex-wrap: nowrap;
flex-direction: row;
column-gap: 24px;
}
.features-table .NS { display:none !important;}
.features-table > div > div{text-align: center;border-bottom:1px solid #555;border-bottom:0.5px solid #555;padding:16px 0;}
.features-table > div > div:first-child, .features-table > div > div:last-child{border-bottom:0;padding-bottom:0;}
/*.features-table > div > div:last-child { padding:40px 0 0;}*/
.features-table > div > div:last-child p { margin-bottom:0;}
.features-table > div > div:last-child a { margin:24px 0 0;color:#000;}
.features-table > div > div:nth-child(2){padding-top:0;}
.features-table > div > div img { max-width: none;width:100%;}
.features-table > div:nth-child(4n+4){ margin: 0;}
.features-table > div picture.flag img{ width:42px;margin-right: 17px;}
.features-table img.swatch{ mix-blend-mode: multiply;}
.features-table > div h3{ color:#000;text-align: center;}
.features-table > div p{ color:#555;text-align: center;margin-bottom:8px;}
.features-table-column{ display: flex !important;flex: 0 0 calc(50% - 12px) !important;flex-direction: column;text-align: center;padding:16px 0 0;}
.stripe-features.addSticky .stickyNav {display: flex;position: sticky; top:0;;z-index: 97;height:40px;align-items: center;flex-basis: 100%;}
.stripe-features.addSticky .stickyNav ul{display: flex;height:40px;margin:0;}
.stripe-features.addSticky .stickyNav li{width: 12px;height:12px;background-color:#D4D4D4;display: block;margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px);border-radius: 50%;cursor:pointer;}
.stripe-features.addSticky .stickyNav li.on{background-color:#E59804;}
.stripe-features.addSticky .features-table .th{position: sticky;background-color: #fdfdfd !important;top:0 !important;z-index: 98;}
/*.features-table .th h3{ display: none}*/
.features-table .th select {
display: none; /*hide original SELECT element: */
}
.select-selected {
background-color: #F3F4F6;
}
/* Style the arrow inside the select element: */
.select-selected:after {
position: absolute;
content: "";
top: 14px;
right: 10px;
width: 0;
height: 0;
border: 6px solid transparent;
border-color: #FDFDFD transparent transparent transparent;
}
/* Point the arrow upwards when the select box is open (active): */
.select-selected.select-arrow-active:after {
border-color: transparent transparent #FDFDFD transparent;
top: 7px;
}
/* style the items (options), including the selected item: */
.select-items div,.select-selected {
color: #000;
font-family: var(--font-text-medium);
padding: 8px 16px;
border: 1px solid transparent;
border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
cursor: pointer;
}
/* Style items (options): */
.select-items {
position: absolute;
background-color: #FDFDFD;
font-family: var(--font-text-regular);
top: 100%;
left: 0;
right: 0;
z-index: 99;
}
/* Hide the items when the select box is closed: */
.select-hide {
display: none;
}
.select-items div:hover, .same-as-selected {
background-color: #F3F4F6;
border-left:4px solid #E59804;
}
@media (min-width: 600px) {
.features-table-column{ display: flex;flex: 0 0 calc(33% - 14px) !important;}
}
@media (min-width: 768px) {
.features-table-column{ display: flex;flex: 0 0 calc(25% - 18px) !important;}
.features-table select{ display: none}
.features-table .th h3{ display: block}
.pi.stripe-features{ margin-top:80px !important;gap:0;}
}
@media (min-width: 1280px) {
.stripe-features .stickyNav{ display: none;}
.stripe-features{ display: grid;
grid-template-columns: repeat(12, 1fr);
grid-template-rows: 1fr;
grid-column-gap: 32px;
grid-row-gap: 0px;}
.stripe-features > div:first-child{grid-area: 1 / 1 / 2 / 5;}
.stripe-features > div:last-child{ grid-area: 1 / 5 / 2 / 13;}
.stripe-features div.sticky-container{ height:100%;}
.stripe-features div.sticky-content{ position: sticky;position: -webkit-sticky;top: 32px;z-index:20;margin-top:0;padding-right:32px;
visibility: hidden;opacity: 0;transition: opacity var(--fadein-time) ease-in, visibility 0ms ease-in var(--fadein-time);}
.features-table-container{ width:auto;overflow-x:initial;max-width: 100%;}
.features-table{ display: flex;flex-direction: row;justify-content: space-around;width: auto;width: 100%;max-width: 1054px;overflow-x: initial;column-gap: 32px;}
.features-table > div{
flex: 0 0 calc(25% - 24px) !important;display: flex;flex-direction: column;
text-align: center;padding:0;}
.features-table-column{flex:0 1 25%;padding-top: 0;}
.stripe-features.addSticky .features-table .th{top:0;}
.stripe-features.addSticky .features-table .th{ padding-top:32px;}
.porcelain-faqs .pr32 { padding-right:32px;}
}
@media (min-width: 1600px){
.pi.stripe-features { margin-top:20px !important;}
}
.bg-beige{ background:#FAF6F4 !important;}
.image-text-banner { display:flex;flex-direction: column}
.banner-50-50{ grid-template-columns: 1fr 1fr;}
.mw-1600{ max-width:1600px;}
ul.with-triangles{ margin:37px 0 18px;}
ul.with-triangles li{ display: flex;align-items: center;gap:12px;line-height: 17px;}
ul.with-triangles li:before {
content: '';
height: 9px;
display: inline-block;
flex-basis:7px;
flex-basis:7.5px;
border-top: 4.5px solid transparent;
border-bottom: 4.5px solid transparent;
border-left: 7.89px solid var(--color-cheshire);
}
ul.with-triangles li + li {margin-top:15px;}
.good-points-text { padding: 0 16px 16px;}
@media (min-width: 1024px){
.good-points-text { padding: 32px 24px 24px;}
ul.with-triangles li{ line-height: 24px;}
ul.with-triangles li:before {
content: '';
height: 12px;
display: inline-block;
flex-basis:13px;
border-top: 6.93px solid transparent;
border-bottom: 6.93px solid transparent;
border-left: 12px solid var(--color-cheshire);
}
ul.with-triangles li + li {margin-top:20px;}
}
@media (min-width: 768px) {
.image-text-banner {
display: grid;
}
}
.figure-container {
display: flex;
flex-direction: column;
/*width: 80%;*/
margin-left:auto;
margin-right: auto;
}
.figure-container figure{
display: inline-block;
margin-bottom: 32px;
}
.figure-container figure:last-child{ margin-bottom:0;}
.figure-container figure div{
overflow: hidden;
}
.figure-container figure div.black-bg{
background-color: #000;
}
.figure-container figure p{
/*font-size: clamp(0.9376rem, 0.5294rem + 0.9804vw, 1rem);*/
}
.figure-container figure p a, a.chevron-black{
color: #000;
background: transparent url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/hub_chevron_right.svg') no-repeat right center;
background-size: 16px 16px;
height: 20px;
padding-right:24px;
display: inline-block;
background-position-y: bottom;
}
.figure-container figure p a:hover, a.chevron-black:hover{
background-image: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/hub_chevron_right_black.svg');
}
.figure-container img {
opacity: 1.0;
transform: scale(1);
transition: opacity var(--easeout-time) ease-in-out;
-moz-transition: opacity var(--easeout-time) ease-in-out;
-webkit-transition: opacity var(--easeout-time) ease-in-out;
width: 100%;
}
.figure-container img:hover {
opacity: 0.6;
transform: scale(1.1);
transition: all var(--easeout-time) ease-in-out;
-moz-transition: all var(--easeout-time) ease-in-out;
-webkit-transition: all var(--easeout-time) ease-in-out;
background-color:red;
}
.figure-container figure h2{
color:#000;
/*font-size: clamp(1.25rem, 1.0323rem + 0.9677vw, 2rem);*/
margin:16px 0 16px;
line-height: 28px;
min-height:29px;
}
@media (min-width: 768px) {
.figure-container {display: grid;
grid-template-columns: repeat(12, 1fr);
grid-template-rows: repeat(28, 1fr);
grid-column-gap: 32px;
grid-row-gap: 0px;
}
.figure-container figure{margin-bottom: 0;position: relative}
.figure-container figure p a, a.chevron-black{
background-size: 24px 24px;
height: 24px;
padding-right:40px;
}
.figure-container figure:nth-child(odd) p{
width: 85%;
}
.figure-container figure h2{
margin: 32px 0 18px;
min-height: 48px;
line-height: 48px;
}
.fig1 { grid-area: 1 / 2 / 9 / 7;}
.fig2 { grid-area: 1 / 8 / 12 / 12;}
.fig3 { grid-area: 11 / 2 / 19 / 7;}
.fig4 { grid-area: 14 / 8 / 25 / 12;}
.fig5 { grid-area: 21 / 2 / 29 / 7;}
}
@media (min-width: 1600px) {
/*.figure-container figure h2{*/
/* margin: 32px 0 18px;*/
/* min-height: 48px;*/
/* line-height: 48px;*/
/*}*/
.figure-container figure p:last-child{ margin-top:20px;}
.fig3 { top:-20px}
.fig4 { top: 0;}
.fig5 { top:-40px;}
}
.why-pocelain-bg{ background:transparent none;text-align: left;align-items: normal; }
.why-pocelain-bg > div {background-color: #f9f7f4;}
.why-pocelain-bg > div:first-child {position: relative;width:100%;}
.why-pocelain-bg > div:last-child {padding:31px 16px 16px;}
.why-pocelain-bg > div img {width: 100%;}
.video-link::before{ content: "";display: block;width: clamp(65px, 7.5vw, 120px);height: clamp(65px, 7.5vw, 120px);position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 100;background: url(/media/skin/environment/hub_play.svg) no-repeat 50% 50%;background-size: cover;}
.why-pocelain-bg h2 span{display: block;color:#555555;font-weight: 400;}
/*.dynamic-sizes > div + div.good-points-container.mmt32{ margin-top: clamp(32px, 5vw, 45px);}*/
@media (min-width: 768px) {
/*.dynamic-sizes > div + div.good-points-container.mmt32{ margin-top: clamp(45px, 5vw, 80px);}*/
.why-pocelain-bg{ display: flex;flex-direction: column; }
.why-pocelain-bg > div:last-child > div { display: flex;align-items: end;justify-content: space-between;}
.why-pocelain-bg > div:last-child > div > div:first-child { max-width: calc(100% - 135px)}
.why-pocelain-bg h2 span{display: inline;color:inherit;}
}
@media (min-width: 1280px) {
.why-pocelain-bg{ flex-direction: row;background:transparent url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/Why_Porcelain_Banner.jpg') bottom left no-repeat;text-align: left;align-items: flex-end;margin-top:27px !important; }
.why-pocelain-bg > div {background-color: transparent;}
.why-pocelain-bg > div:first-child { flex:0 0 584px;}
}
@media (min-width: 1600px) {
.why-pocelain-bg{ background:transparent url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/Why_Porcelain_Banner.jpg') bottom left no-repeat;text-align: left;align-items: flex-end;margin-top:27px !important; }
.why-pocelain-bg > div {background-color: transparent;}
.why-pocelain-bg > div:first-child { flex: 0 0 830px;}
.why-pocelain-bg > div img { max-width: 584px;}
}
.grid-copy, .grid-copy:not(.grid) * { display:none;}
.grid-copy.grid, .grid-copy.showcontent { display:block;}
.grid-copy.grid > div, .grid-copy.showcontent > div, .grid-copy.showcontent .faq-item-header{ display:flex;}
.grid-copy.grid div div p, .grid-copy.grid div div ul, .grid-copy.grid div div h3 { display:none;}
.grid-copy.grid div div p:nth-child(-n+2) { display:revert;}
.grid-copy > div{
display: flex;
flex-direction: column;
grid-template-columns: repeat(12, 1fr);
column-gap: 32px;
border-top:1px solid #AEAEAE;
padding-top:clamp(32px, 7vw, 128px);
margin-bottom: clamp(32px, 7vw, 128px);
}
.body-filter-open .grid-copy > div {
column-gap: 100px; /* so the vertical alignment will be perfect on product listing page... */
}
.grid-copy > div:last-child{ margin-bottom:2px;}
/*.grid-copy.grid > div{*/
/* border-top:0;*/
/* padding-top:0;*/
/*}*/
.grid-copy > div > div:nth-child(odd){
grid-column: 1 / 5;
}
.grid-copy > div > div:nth-child(even){
grid-column: 5 / 13;
}
a.readmore{ color:#E59804 !important;line-height: 24px;display: flex;text-decoration: none !important;}
a.readmore::after{ content:'';width:24px;height:24px;display:inline-block;background:url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/hub_chevron_right_orangearrow.svg');transform: rotate(90deg); margin-left: 16px;}
a.readmore:hover::after{ content:'';background:url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/hub_chevron_right_orange.svg');transform: rotate(90deg);margin-left: 16px;}
a.readless::after{ transform: rotate(270deg);margin: 0 0px -5px 16px;}
a.readless:hover::after{ transform: rotate(270deg);margin: 0 0px -5px 16px;}
.readmore-container p, .readmore-container h3, .readmore-container h4 {margin-top:clamp(1.333333333333333em, 1.5vw, 1.5em)}
.readmore-container p:first-child {margin-top:0}
.readmore-container h3 {margin-top:clamp(1.333333333333333em, 1.5vw, 1.5em);font-size:16px;}
.readmore-container p:first-child, .readmore-container p:last-child, .readmore-container .elipsis {display: revert}
.readmore-container.showcontent * {display: revert;color:#555;}
.readmore-container.showcontent li {display: flex;}
.readmore-container.showcontent h3, .readmore-container.showcontent h2 {display: revert;color:#000;}
.readmore-container.showcontent a {color:inherit;text-decoration: underline}
.readmore-container.showcontent strong {color:#000;}
.readmore-container.showcontent ul li a {color:#000;text-decoration: none;font-family:var(--font-display-medium);}
.readmore-container.showcontent h4 {font-size: 16px;color:#000;}
.readmore-container.showcontent .elipsis, .readmore-container.showcontent .readmore {display: none;}
.faq-item.open {border-bottom:0.5px solid var(--color-emperor);padding-bottom:32px;}
.faq-item-body {display: none !important;}
.faq-item.open .faq-item-body {display: block !important;}
.faq-item h4 { margin:0;font-family: var(--font-text-medium) !important}
@media (min-width: 768px) {
.readmore-container h3 { font-size:24px;}
.readmore-container p, .readmore-container ul { }
/*.cont-app-copy{ display: grid;}*/
.grid-copy > div{
display: grid;
row-gap:32px;
margin-bottom: 30px;
}
.grid-copy.grid > div, .grid-copy.showcontent > div{ display:grid;}
}
.tp-widget-cont{
width: 116px;
height: 91px;
}
/* faux select box */
.select-box {
display: flex;
width: auto;
flex-direction: column;
margin-bottom: 40px;
text-align: left;
font-size: 16px;
position: relative;
}
@media(min-width:768px){
.select-box{ display: none;}
}
.selected {
background: #f3f4f6;
font-family: var(--font-text-medium);
color: #000;
position: relative;
order: 0;
}
.selected::after {
content: "";
background: url("https://d1ctifminpgohi.cloudfront.net/category-page/category-arrow-down.svg");
background-size: contain;
background-repeat: no-repeat;
position: absolute;
height: 14px;
width: 16px;
right: 16px;
top: 20px;
transition: all 0.4s;
}
.sort-swatches .selected::after {
transition: transform 0.3s ease-in-out;
}
.select-box .options-container.active {
opacity: 1;
}
.select-box .options-container.active + .selected::after {
transform: rotate(180deg);
}
/* .select-box .options-container::-webkit-scrollbar {*/
/* width: 8px;*/
/* background: #FDFDFD;*/
/*}*/
.select-box .options-container::-webkit-scrollbar-thumb {
background: #FDFDFD;
}
.select-box .option,
.selected {
line-height: 40px;
cursor: pointer;
padding: 6px 16px 6px;
border-left: 4px solid transparent;
}
.select-box .option:last-child{
padding-bottom: 12px;
}
.select-box .option:hover {
background: #EDF0F0;
color:#000;
/*border-left:4px solid #E59804;*/
}
.select-box .option:focus {
background: #EDF0F0;
color:#000;
}
.select-box label {
cursor: pointer;
}
.select-box .option .radio {
display: none;
}
.porcelain-faqs > div:first-child{ margin-bottom:32px;}
.porcelain-faqs > div:first-child a { color:#000;}
@media (min-width:1600px) {
.stripe-features.porcelain-faqs {
margin-top: 128px !important;
}
}
/*end Porcelain intermediary page*/
/*cookie notice*/
#cookieConsent .manage-2{ display:none;}
#cookieConsent .manage-2.show{ display:block;}
#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: auto;
left: 50%;
bottom: clamp(24px, 5vw, 64px);
transform: translateX(-50%);
max-width: 1233px;
z-index: 99999999;
background-color: #DADEE1;
color: var(--color-white);
padding: 24px;
width:calc(100% - 48px);
height: auto;
}
#cookieConsent .content.showpref{
width:calc(100% - 48px);
top:0;
left: 0%;
transform: none;
height:calc(100% - 48px);
margin:24px;
overflow: hidden;
background: var(--color-white);
}
#cookieConsent .content .fs-h2{
margin-bottom:16px;
display: none;
}
#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: 16px;
font-size: 16px;
line-height: 24px;
font-weight: 400;
color: var(--color-emperor);
}
#cookieConsent .content button{
margin:0;
height:40px;
text-transform: capitalize;
background: var(--color-cheshire);
border: 1.5px solid var(--color-cheshire);
padding:0 16px;
color: var(--color-white);
min-width: 184px;
width: 100%;
font-family: var(--font-text-regular);
letter-spacing:-0.08px;
font-size:16px;
&:hover {
background-color: #D9C29F;
border-color: #D9C29F;
}
&:first-child{
margin-right:32px;
}
}
#cookieConsent .content button:focus,
#cookieConsent .content button:active{
background-color: #9A7B4C;
border-color: #9A7B4C;
}
#cookieConsent .content button.decline{
background-color: transparent;
font-size: 16px;
line-height: 12px;
color: var(--color-cheshire);
border: 1.5px solid var(--color-cheshire);
&:hover {
background-color: #F9F5EF;
}
}
#cookieConsent .content button.decline:focus,
#cookieConsent .content button.decline:active{
background-color: #F2EBDF;
color: #9A7B4C;
}
#btn-cookie-manage{ margin-bottom: 16px !important;}
#cookieConsent .content button span{ display:block;}
#cookieConsent a{ color:var(--color-emperor);text-decoration: none;}
#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;
display: none;
}
#cookieConsent .first-row{
border-top:1px solid var(--color-cheshire-grey);
padding-top:32px;
margin-top:32px;
}
#cookieConsent .content .preferences{
height: 100%;
padding-bottom: 120px;
}
#cookieConsent .content .preferences .modal-scroll{
height: 100% !important;
}
#cookieConsent .content .preferences .row{
padding-bottom: 32px;
margin-bottom: 32px;
border-bottom: 0.5px solid var(--color-cheshire-grey);
}
#cookieConsent .content .preferences .scroll .row:last-child{
margin-bottom: 0;
border-bottom: none;
}
#cookieConsent .content .preferences .row p{
color: var(--color-emperor);
font-size: clamp(12px,1vw,16px);
line-height: clamp(20px,2vw,24px);
font-weight: 400;
}
#cookieConsent .content .preferences .row p strong {
color: var(--color-black);
font-size: 16px;
line-height: 24px;
font-weight: 600 !important;
}
#cookieConsent .content .preferences .row p:nth-child(2){
color: var(--color-cheshire);
margin-top: 24px;
font-size: 16px;
line-height: 24px;
font-weight: 600;
}
#cookieConsent .content.showpref .fs-h3{
color: var(--color-black);
font-size: clamp(20px,2vw,28px);
line-height: clamp(28px,2.5vw,36px);
font-weight: 600;
}
#cookieConsent .content.showpref a{
color: var(--color-black);
}
#cookieConsent .content.showpref .first-row{
padding-top: 32px;
margin-bottom: 32px;
margin-top: 32px;
border-top: 0.5px solid var(--color-cheshire-grey);
}
#cookieConsent .content.showpref .actions{
position: absolute;
top: auto;
left: 0;
right: 0;
bottom: 0;
padding: 24px;
display: flex;
flex-direction: column;
gap: 16px;
background-color: #DADEE1;
}
#cookieConsent .content.showpref button.decline{
margin-right: 0;
}
#cookieConsent .cart-header{
grid-template-columns: 1fr;
border-bottom: none !important;
}
#cookieConsent .cart-header .switch--horizontal{
left: -24px;
margin-top: 24px;
}
.ls-create-retail-account .ls-page__header, #trade_signup_form .ls-content__head{
margin-top: 28px;
margin-bottom: 0;
}
.ls-create-retail-account .ls-page__header{
margin-top: 48px;
}
.ls-create-retail-account h1, #trade_signup_form h1{
color: var(--color-black);
font-size: clamp(32px,3vw,40px);
line-height: 36px;
font-weight: 600;
letter-spacing: -0.1px;
margin-bottom: clamp(24px,3vw,48px);
}
.ls-create-retail-account h1{
margin-bottom: 48px;
}
#trade_signup_form .ls-content__head .catList-descr{
color: var(--color-black);
font-size: clamp(20px,2vw,28px);
line-height: clamp(28px,3.5vw,36px);
font-weight: 600;
letter-spacing: -0.1px;
max-width: 1196px;
margin: 0 auto;
}
#trade_signup_form .ls-content__head .ruleoff{
display: none;
}
#trade_signup_form .ls-contacts-threeup{
margin: 0;
margin-top: clamp(48px,5vw,64px);
}
#trade_signup_form .ls-contacts-threeup ul{
gap: clamp(24px,2vw,32px);
}
#trade_signup_form .ls-contacts-threeup ul li{
border: 1px solid var(--color-cheshire-card);
padding: 30px 40px;
margin-bottom: 0;
}
#trade_signup_form .ls-contacts-threeup ul li:first-child{
padding: 55px 40px;
}
#trade_signup_form .ls-contacts-threeup ul li h3{
margin-top: 24px;
margin-bottom: 0;
color: var(--color-black);
font-size: 20px;
line-height: 28px;
font-weight: 600;
}
#trade_signup_form .ls-contacts-threeup ul li p{
margin-top: 24px;
margin-bottom: 0;
color: var(--color-emperor);
font-size: clamp(12px,1vw,16px);
line-height: clamp(20px,2vw,24px);
font-weight: 400;
}
#trade_signup_form .ls-contacts-threeup ul li a{
margin-top: 24px;
margin-bottom: 0;
color: var(--color-cheshire);
font-size: 20px;
line-height: 28px;
font-weight: 600;
text-decoration: none;
}
#trade_signup_form .ls-contacts-threeup ul li img{
margin: 0;
}
#trade_signup_form .ls-contacts-threeup ul li .pass_reset{
position: relative;
}
#trade_signup_form .ls-contacts-threeup ul li .pass_reset .reset_lock{
position: absolute;
margin: 0;
min-width: 24px;
width: 24px;
height: 27px;
top: 50%;
left: 55%;
transform: translate(-50%, -50%);
}
.ls-create-retail-account .fieldset{
margin-bottom: 20px;
position: relative;
}
#trade_signup_form h2 {
display: flex;
align-items: center;
gap: 16px;
}
.ls-create-retail-account h2, #trade_signup_form h2, .ls-field-group.pass_reset h2{
color: var(--color-black);
font-size: clamp(16px,1.5vw,28px);
line-height: 20px;
font-weight: 600;
letter-spacing: -0.1px;
padding-bottom: clamp(24px,3vw,48px);
margin-bottom: clamp(24px,4vw,64px);
border-bottom: 1px solid var(--color-cheshire-grey);
align-items: center;
}
.ls-create-retail-account h2 span, #trade_signup_form h2 span, .ls-field-group.pass_reset h2 span{
color: var(--color-emperor);
font-size: clamp(12px,1vw,16px);
line-height: clamp(9px,0.8vw,12px);
font-weight: 400;
letter-spacing: -0.1px;
width: auto;
}
.ls-field-group.pass_reset .ruleoff{
display: none;
}
.ls-field-group.pass_reset h2 {
font-size: clamp(20px, 2vw, 28px);
line-height: clamp(15px, 1vw, 20px);
flex-direction: column;
align-items: flex-start;
gap: 16px;
margin-top: 48px;
}
@media(min-width: 480px){
.ls-field-group.pass_reset h2 {
flex-direction: row;
align-items: center;
}
.ls-create-retail-account h1,
#trade_signup_form h1 {
line-height: 30px;
}
}
.ls-field-group{
margin-bottom: 48px;
}
#trade_signup_form .ls-field-group p{
margin-top: 0 !important;
margin-bottom: 24px !important;
color: var(--color-emperor);
}
.ls-create-retail-account .field .label, #trade_signup_form .block label, .ls-field-group.pass_reset .block label{
color: var(--color-emperor);
font-size: clamp(12px, 1vw, 16px);
line-height: clamp(8px, 0.8vw, 12px);
font-weight: 400;
letter-spacing: -0.1px;
margin: 0;
}
#trade_signup_form .block#cnBlock, #trade_signup_form .block label[for="Address1"], #trade_signup_form .block label[for="Website"], #trade_signup_form .block label[for="Email"], #trade_signup_form .block label[for="Tel1"], #trade_signup_form .block label[for="Tel2"], #trade_signup_form .block label[for="contactName"]{
margin-top: 12px;
}
#trade_signup_form .block .ts-isSole{
flex-direction: row-reverse;
justify-content: flex-end;
position: relative;
}
#trade_signup_form .block .enterM, #trade_signup_form .submitButton{
margin-top: 4px;
height: 44px;
width: 178px;
background: var(--color-cheshire);
border: 1.5px solid var(--color-cheshire);
font-size: 16px;
line-height: 20px;
font-weight: 500;
}
#trade_signup_form .submitButton{
width: 209px;
padding: 0;
letter-spacing: 0.1px;
}
.ls-field-group.pass_reset{
padding: 0 24px;
}
.ls-create-retail-account .field input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]), .ls-create-retail-account .field textarea, #trade_signup_form .block input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]), #trade_signup_form .block textarea, .ls-field-group.pass_reset .field input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]){
color: var(--color-black);
margin-top: 16px;
background-color: var(--color-white);
border-radius: 0;
border: 1px solid var(--color-cheshire-grey);
font-size: 12px;
line-height: 9px;
font-weight: 400;
height: 32px;
padding: 12px;
}
#password-strength-meter-container{
margin-top: 16px;
font-size: clamp(12px,1vw,16px);
line-height: clamp(12px,1vw,16px);
}
#trade_signup_form .block{
flex-basis: auto;
}
#trade_signup_form .block textarea{
height: 220px !important;
margin-top: 0;
}
.ls-create-retail-account .field input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]):hover, .ls-create-retail-account .field textarea:hover, #trade_signup_form .block input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]):hover {
border: 1px solid var(--color-cheshire);
}
.ls-create-retail-account .field input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]):focus, .ls-create-retail-account .field textarea:focus, .ls-create-retail-account .field input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]):active, .ls-create-retail-account .field textarea:active, #trade_signup_form .block input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]):focus, #trade_signup_form .block input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type=file]):active{
border: 1px solid var(--color-cheshire);
box-shadow: inset 5px 0 0 -2px var(--color-cheshire-border);
}
#trade_signup_form .block .select-css{
margin-top: 16px;
background-color: transparent;
background-image: url("https://d1ctifminpgohi.cloudfront.net/category-page/category-arrow-down.svg");
background-repeat: no-repeat;
background-size: 16px 8px;
padding: 0 12px;
height: 32px;
font-size: 12px;
font-weight: 400;
line-height: 20px;
border: 1px solid var(--color-cheshire-grey);
box-shadow: none;
border-left: none;
border-right: none;
}
.ls-create-retail-account .field .password-none{
display: none;
}
.ls-create-retail-account .ls-field-group .row-simple, #trade_signup_form .ls-field-group .row-simple{
display: flex;
flex-direction: column;
gap: 24px;
color: var(--color-emperor);
font-size: 12px;
line-height: 20px;
font-weight: 400;
margin-bottom: 32px;
width: 100%;
max-width: 595px;
}
#trade_signup_form .ls-field-group .row-simple {
margin-bottom: 0;
}
#trade_signup_form .ls-field-group .block .attach{
width: 151px;
height: 44px;
font-size: 16px;
line-height: 20px;
font-weight: 500;
display: flex;
justify-content: center;
align-items: center;
color: var(--color-white);
background: var(--color-cheshire);
border: 1.5px solid var(--color-cheshire);
}
#trade_signup_form .block .enterM:hover,
#trade_signup_form .submitButton:hover,
#trade_signup_form .ls-field-group .block .attach:hover,
.ls-create-retail-account .account button.submit:hover,
.ls-field-group.pass_reset .actions-toolbar button.submit:hover{
border: 1.5px solid #D9C29F;
background: #D9C29F;
}
#trade_signup_form .block .enterM:active,
#trade_signup_form .submitButton:active,
#trade_signup_form .ls-field-group .block .attach:active,
.ls-create-retail-account .account button.submit:active,
.ls-field-group.pass_reset .actions-toolbar button.submit:active,
#trade_signup_form .block .enterM:focus,
#trade_signup_form .submitButton:focus,
#trade_signup_form .ls-field-group .block .attach:focus,
.ls-create-retail-account .account button.submit:focus,
.ls-field-group.pass_reset .actions-toolbar button.submit:focus{
border: 1.5px solid #9A7B4C;
background: #9A7B4C;
}
#trade_signup_form .ls-field-group .block span{
font-size: clamp(12px,1vw,16px);
font-weight: 400;
line-height: 20px;
color: var(--color-emperor);
}
#trade_signup_form .ls-field-group .block.attachment{
display: flex;
flex-direction: row;
align-items: center;
gap: 16px;
}
#trade_signup_form .ls-field-group #logoRow{
gap: 0;
}
#trade_signup_form .ls-field-group .row-simple:nth-child(4){
display: none;
}
.ls-create-retail-account .ls-field-group .row-simple label, #trade_signup_form .ls-field-group .row-simple label{
display: flex;
flex-basis: auto;
align-items: center;
position: relative;
font-size: 12px;
line-height: 20px;
font-weight: 400;
letter-spacing: 0.5px;
}
.ls-create-retail-account .ls-field-group .row-simple label input[type="checkbox"],
.ls-create-retail-account .ls-field-group .row-simple label input[type="radio"],
#trade_signup_form .block input[type="checkbox"], #trade_signup_form .block input[type="radio"],
#trade_signup_form .row-simple input[type="checkbox"], #trade_signup_form .row-simple input[type="radio"], #trade_signup_form .block #soleT
{
width: 24px;
height: 24px;
margin-right: 16px;
border: 1px solid var(--color-cheshire);
box-shadow: inset 0px 0px 0px 1.5px var(--color-cheshire);
background: transparent;
}
.ls-create-retail-account .ls-field-group .row-simple label input[type="checkbox"]:hover::after,
#trade_signup_form .block input[type="checkbox"]:hover::after,
#trade_signup_form .row-simple input[type="checkbox"]:hover::after,
#trade_signup_form .block #soleT:hover::after{
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
height: 24px;
width: 24px;
z-index: 2;
background: url('https://d1ctifminpgohi.cloudfront.net/icons/checkbox-hover.svg');
}
#trade_signup_form .block #soleT:hover::after {
top: auto;
bottom: 0;
}
.ls-create-retail-account .ls-field-group .row-simple label input[type="checkbox"]:checked::after, #trade_signup_form .block input[type="checkbox"]:checked::after, #trade_signup_form .row-simple input[type="checkbox"]:checked::after, #trade_signup_form .block #soleT:checked::after{
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
height: 24px;
width: 24px;
z-index: 2;
background: url('https://d1ctifminpgohi.cloudfront.net/icons/checkbox-checked.svg');
}
#trade_signup_form .block #soleT:checked::after {
top: auto;
bottom: 0;
}
.ls-field-group.pass_reset .row{
margin: 0;
}
.ls-create-retail-account .account button.submit, .ls-field-group.pass_reset .actions-toolbar button.submit{
height: 44px;
width: 184px;
font-size: 16px;
line-height: 20px;
font-weight: 500;
margin-top: 0;
padding: 0;
letter-spacing: -0.1px;
color: var(--color-white);
background-color: var(--color-cheshire);
border: 1.5px solid var(--color-cheshire);
}
.ls-field-group.pass_reset .actions-toolbar button.submit{
width: 276px;
margin-top: 24px;
width: 100%;
}
.ls-content__head.pass_reset{
margin-bottom: clamp(24px,3vw,48px);
}
.ls-content__head.pass_reset h1{
margin-bottom: 0;
font-size: clamp(32px,3.5vw,40px);
line-height: clamp(36px,3.5vw,44px);
font-weight: 600;
color: var(--color-black);
padding: 0 24px;
letter-spacing: 1px;
}
.ls-field-group.pass_reset .ls-content__head{
max-width: 1123px;
margin: 0 auto;
}
.ls-field-group.pass_reset .field.note{
margin-bottom: 0;
font-size: clamp(20px, 3vw, 28px);
line-height: clamp(28px, 3.5vw, 36px);
font-weight: 600;
color: var(--color-black);
letter-spacing: 0.1px;
}
.ls-field-group.pass_reset .field.note.spacing-down{
margin-bottom: 0;
}
#trade_signup_form .ls-field-group .row .block.col13 {
margin-bottom: 16px;
}
.ls-order-basket-main .swiper-extras .swiper-slide.product-item .product-carousel__info{
justify-content: flex-start;
}
.cart-recommend .button{
margin-top: auto;
}
@media(min-width: 768px){
.ls-create-retail-account .ls-field-group .row-simple,
#trade_signup_form .ls-field-group .row-simple,
.ls-create-retail-account .ls-field-group .row-simple label,
#trade_signup_form .ls-field-group .row-simple label {
font-size: 16px;
line-height: 24px;
}
#trade_signup_form .ls-contacts-threeup ul li{
margin-right: 0;
padding: 40px;
}
#trade_signup_form .ls-field-group .row{
grid-template-columns: 1fr;
align-items: flex-end;
}
#trade_signup_form .ls-field-group .row .block.col13{
grid-column: 1;
margin-bottom: 16px;
}
#trade_signup_form .ls-field-group .row-simple{
width: 100%;
}
#trade_signup_form .ls-field-group #logoRow{
display: flex;
flex-direction: column-reverse;
align-items: flex-start;
}
#trade_signup_form>div:nth-child(6)>div:nth-child(3) .row-simple{
width: 100%;
max-width: 100%;
}
#trade_signup_form>div:nth-child(6)>div:nth-child(3) .row-simple .block{
width: 100%;
}
.ls-field-group.pass_reset .field.note {
display: inline;
padding: 0;
letter-spacing: 0.9px;
}
.ls-field-group.pass_reset .actions-toolbar button.submit {
width: 276px;
}
#cookieConsent .cart-header .switch--horizontal{
left: -32px;
}
}
@media (min-width: 1024px) {
.ls-create-retail-account .ls-field-group .row-simple:not(.primary),
#trade_signup_form .ls-field-group .row-simple {
width: 30%;
display: inline-flex;
margin-bottom: 0;
margin-right: clamp(20px, 2vw, 32px);
}
.ls-create-retail-account .actions-toolbar,
#trade_signup_form .ls-field-group .row-simple:not(.terms) {
width: 34%;
margin-right: 0;
display: inline-flex;
align-items: flex-end;
vertical-align: bottom;
}
.ls-create-retail-account .actions-toolbar .row-simple {
margin-bottom: 0;
}
.ls-create-retail-account .account button.submit {
margin-left: auto;
margin-right: 0;
}
#cookieConsent .content{
padding:32px;
}
#cookieConsent .content.showpref .fs-h2.desktop{
display: none;
}
#cookieConsent .content.showpref{
width: 90%;
max-width: 1232px;
top: 48%;
left: 48%;
transform: translate(-50%, -50%);
height: 822px;
}
#cookieConsent .content.showpref .actions{
gap: 32px;
flex-direction: row;
justify-content: flex-end;
}
#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: 1 / span 12;
grid-row: 1;
display: flex;
align-items: center;
justify-content: space-between;
gap: 32px;
}
#cookieConsent .content .fs-h3{
margin-bottom: 0;
max-width: 580px;
}
#cookieConsent .content .actions{
display: flex;
gap: 32px;
}
#cookieConsent .content button{
width: 196px;
}
#cookieConsent .content button:first-child{
margin-right: 0;
}
#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 7;}
#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;}
#cookieConsent .manage-2.show.preferences {
height: 800px;
padding-bottom: 64px;
overflow: hidden;
}
#cookieConsent .content.showpref {
height: 660px;
}
#cookieConsent .cart-header .switch--horizontal {
left: -32px;
}
}
/*radio buttons*/
.up-in-toggle {
margin-top: 16px;
min-height: 36px;
display: block;
}
@media (min-width: 1024px) {
.up-in-toggle {
margin-top: 0;
}
.ls-create-retail-account .actions-toolbar {
width: 34%;
}
#cookieConsent .content .preferences .modal-scroll{
grid-template-columns: 1fr;
gap: 0px;
}
#cookieConsent .content.showpref .fs-h3{
width: 100%;
max-width: 912px;
}
#trade_signup_form .ls-field-group .row-simple p {
margin-bottom: 0 !important;
}
#trade_signup_form .ls-field-group .row {
grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
align-items: flex-start;
}
#trade_signup_form .ls-field-group .row.addressfull .block {
margin-top: 32px;
}
#trade_signup_form .ls-field-group .row .block.col13 {
grid-column: 1/3;
}
#trade_signup_form .ls-field-group .row .block.col13,
#trade_signup_form .ls-field-group .row .block.col13+.block,
#trade_signup_form .block#cnBlock,
#trade_signup_form .block#cnBlock+.block,
#trade_signup_form>div:nth-child(6)>div:nth-child(2)>div:nth-child(2) {
margin-bottom: 32px;
}
#trade_signup_form>div:nth-child(6)>div:nth-child(1)>h2 {
margin-bottom: 32px;
}
#trade_signup_form>div:nth-child(6)>div:nth-child(1)>h2+p {
margin-bottom: 64px !important;
}
#trade_signup_form>div:nth-child(6)>div:nth-child(1)>div:nth-child(5) {
align-items: center;
margin-bottom: 32px;
}
#trade_signup_form .block#cnBlock {
margin-bottom: 0;
}
#trade_signup_form .block#cnBlock+.block {
margin-bottom: 0;
margin-top: 24px;
}
#trade_signup_form>div:nth-child(6)>div:nth-child(1)>div:nth-child(6) {
grid-template-columns: 1fr;
grid-row-gap: 32px;
}
#trade_signup_form>div:nth-child(6)>div:nth-child(4)>h2 {
margin-bottom: 32px;
}
#trade_signup_form .ls-field-group p {
margin-bottom: 32px !important;
}
#cookieConsent .cart-header .switch--horizontal{
left: 48px;
margin-top: 0;
}
}
@media (min-width: 1280px) {
#cookieConsent .cart-header .switch--horizontal {
left: 64px;
}
}
@media (min-width: 1360px) {
.ls-create-retail-account .fieldset.info .row:not(.customer-name){
position: absolute;
bottom: 0;
right: 0;
width: 32%;
}
#maincontent{
margin: 0 auto;
}
}
@media (min-width: 1600px) {
.ls-create-retail-account .ls-page__header, #trade_signup_form .ls-content__head{
margin-bottom: 48px;
}
.ls-create-retail-account .ls-page__header{
margin-top: 64px;
margin-bottom: 0;
}
.ls-create-retail-account .actions-toolbar {
width: 35%;
}
.ls-field-group.pass_reset {
padding: 0;
}
.ls-content__head.pass_reset{
margin-top: 48px;
}
.ls-field-group .row{
margin: 0;
}
.ls-field-group .block{
margin-bottom: 0;
}
.ls-create-retail-account .fieldset{
margin-bottom: 64px;
}
.ls-field-group{
margin-bottom: 64px;
}
#cookieConsent .manage-2.show.preferences{
height: 815px;
padding-bottom: 64px;
}
#cookieConsent .modal-scroll {
overflow-y: hidden;
}
#cookieConsent .content.showpref{
height: 880px;
}
#trade_signup_form>div:nth-child(6)>div:nth-child(1)>div:nth-child(6) .block {
max-width: 512px;
}
#trade_signup_form .ls-field-group:last-child .row-simple:not(.terms) {
width: 35%;
}
#cookieConsent .cart-header .switch--horizontal {
left: 72px;
}
}
.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-cheshire);
color: var(--color-white);
font-weight: 500;
}
.up-in-toggle input:checked + label.off{
background: var(--color-cheshire-toggle);
color: var(--color-white);
}
.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*/
/***************************************** Product page *********************************************/
body.ovhidden{ overflow: hidden;}
.page-product-grouped #maincontent {margin:0;}
.fs-clamp p.small-text, .fs-clamp p.small-text a, .fs-clamp ul.small-text{ font-size: 12px;line-height: 18px;}
.ls-pn-container h2:first-child, .ls-pn-details .ls-pn-price{ display: inline-block;}
.fs-clamp .ls-grid-mtag{ z-index: 9;}
.product-page-grid {padding:0;display: flex;flex-direction: column;padding:0;}
.grid-image{max-width:1056px;min-width: 0;grid-area: grid-image;/*background-color: aqua;*/}
.grid-image picture{ width:100%;}
.swiper-gallery-pagination-holder{ padding:12px 24px;font-size:12px;background-color: #EDEFF0;color: #1D1D1F;}
.swiper-gallery-pagination-holder > div{ flex-shrink: 0;}
.swiper-gallery .slide-caption { flex-shrink:0;flow-grow:1;}
.swiper-gallery-pagination.swiper-pagination-fraction { display: flex;width:min-content;}
#slide-caption { display:none}
.swiper-pagination-current { color:#000;}
.chevron-circle { background-image: url('data:image/svg+xml,');background-repeat: no-repeat;background-position: 50% 50%;width:32px;height:32px;opacity: 1;border-radius: 50%;background-size: 32px 32px;background-position: 0 0;transform: rotate(180deg)}
.chevron-circle::after, .chevron-circle:after{ content:none;}
.swiper-button-prev.chevron-circle {transform: none;}
.chevron-circle.withshadow{-webkit-box-shadow: 2px 2px 2px 0px rgba(61,61,61,0.8);-moz-box-shadow: 2px 2px 2px 0px rgba(61,61,61,0.8);box-shadow: 2px 2px 2px 0px rgba(61,61,61,0.8);}
.grid-actions { grid-area: grid-actions;position: relative;}
/*grid-form spacing*/
.grid-form {overflow-x: hidden;}
.grid-form .cont-flex{ display: flex;flex-direction: column;padding-bottom:32px;}
.product-page-grid > .title-price{ padding:8px 24px 48px}
.grid-form > .title-price{ display: none;}
.product-page-grid h1{ order:1;font-size:24px !important;font-weight: 600;color:#000;margin:0 0 24px 0;}
.product-page-grid h1 span{ display: block;font-size:24px !important;font-weight: 600}
.product-page-grid #productFromPrice{ margin-bottom:24px;order:2;font-size: 20px;}
.product-page-grid #productFromPrice *{ font-size: 20px;line-height:32px;font-weight: 500;letter-spacing:-1px;color:#4E5252;}
.product-page-grid #productFromPrice .fs-h2{ font-size:28px;line-height: 32px;font-weight: 600;letter-spacing: -1.4px;color:#CDAE74;display: inline-block;}
.product-page-grid .carbon-text{ order:3;margin-bottom:32px;}
.product-page-grid .carbon-text p{ font-size: 12px;background: url("https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/co2-foot.svg") no-repeat left center;background-size: 22px 20px;padding-left:34px;}
.product-page-grid .carbon-text h4{ display: none;}
.product-page-grid .delivery-text{ order:4;font-size: 16px;color:#000;font-weight:500;line-height: 20px;letter-spacing: -0.8px;display: flex;gap:18px;}
.product-page-grid .delivery-text em.green{ flex-shrink:0;display:inline-block;padding:0 5px;text-transform:uppercase;margin-right:6px;font-weight: 500;height:25px;padding:0 16px;font-style:normal;line-height: 25px;text-align: center;font-size:12px;letter-spacing: 0.6px;}
.product-page-grid .delivery-text > span{ margin-top:3px;line-height: 20px;}
.product-page-grid .delivery-text, .product-page-grid .delivery-text #productLead, .product-page-grid .delivery-text #productLead strong {color:#4E5252;}
.product-page-grid .delivery-text strong{ color:#000;font-weight: 600 !important;}
.product-page-grid .delivery-text #productLead strong{ font-weight: 500 !important;}
.grid-form .cont-qc{ order:3;margin:12px 0 20px;font-size: 12px;}
.grid-form .cont-qc span{ margin-left:12px;line-height: 20px;color:#000;}
.product-page-grid .description-text{ order:5;padding-top: 25px;padding-top: 24.5px;margin-bottom:43px;border-top:1px solid #D7D4D9}
.product-page-grid .also-text{ order:6;}
.product-page-grid .also-text h4{ margin-bottom:20px;}
.product-page-grid .showroom-text{ order:7;}
.product-page-grid .online-text{ order:8;}
.product-page-grid .outofstock-text{ order:9;}
.row-price { color:#E48E00;display:block}
.grid-form .product-add-form{ background-color: #EDF0F0;padding: 0 24px;overflow-y:auto;overflow-x:hidden;margin:0}
.grid-form .product-add-form h4{margin:24px 0 18px;}
.grid-form .product-add-form h4{margin:24px 0 18px;}
.grid-actions ul{ display: flex;flex-direction: row}
.grid-actions ul li{ flex-grow:1;text-align: center;}
.grid-actions ul li img{ margin-right: 16px;}
ul.tabs-pricing { background-color: #D7D4D9;}
ul.tabs-pricing li { margin:2px;padding:4px 0;cursor: pointer}
ul.tabs-pricing li.on, ul.tabs-pricing li:hover { background-color: #FDFDFD;color:#555;font-family: var(--font-text-medium)}
.open_product_qc { background-image: url("https://d1ctifminpgohi.cloudfront.net/icons/icon-calculator.svg");background-color:transparent;border:0 !important;min-height:auto !important;width:24px;height:24px;background-size:contain;}
.open_product_qc:hover { background-image: url("https://d1ctifminpgohi.cloudfront.ne/icons/icon-calculator.svg");background-color:transparent;border:0;width:24px;height:24px;}
/*add to cart buttons*/
.grid-form .cont-buttons{ display:flex;flex-direction:column;row-gap: 18px;padding:8px;background-color:#FDFDFD;margin-bottom:32px;}
.grid-form .cont-buttons button, .grid-form .cont-buttons .a-button { font-size: 12px;color:#555;border:1px solid #555;background-color:#FDFDFD;text-transform:none;padding:12px 0;text-align: center}
.grid-form .cont-buttons button.primary { font-size: 16px;color:#fff;border:1px solid #E48E00;background-color:#E48E00;text-transform:none;}
.grid-form .more-buttons{ display:flex;flex-direction:row;column-gap: 24px;}
.grid-form .more-buttons button, .grid-form .cont-buttons .a-button{ flex-grow:1;margin:0;}
.grid-nav{max-width:1056px;grid-area: grid-nav;display: none;position: sticky;top:196px;z-index: 999;background-color:#fdfdfd;
}
.grid-nav ul{ display: flex;margin-top:56px;}
.grid-nav ul li{ flex-grow:1;padding:5px 0 16px;border-bottom: 1px solid #AEAEAE;background-color: #FDFDFD;flex-basis:100%;text-align: center;}
.grid-nav ul li.on, .grid-nav ul li:hover{ border-bottom: 4px solid #E59804;}
.grid-nav ul li.on a{ font-family: var(--font-text-medium);}
.grid-nav ul li a { color:#555555;}
.grid-nav ul li:first-child { text-align: left}
.grid-nav ul li:last-child { text-align: right}
.grid-nav ul li:first-child a { margin-left:0;}
.cont-paypal{overflow: hidden;background-color: #122B78;margin-bottom: 32px;}
.cont-paypal > div{display: flex;justify-content: center;}
.cont-paypal > div > span{display: flex;padding:9px 17px 3px 24px}
.grid-tabs{max-width:1056px;grid-area: grid-tabs;padding:0 24px;}
.grid-tabs p { font-size: 12px;color:#4E5252;line-height: 20px;}
.grid-tabs h3 {font-size:12px;font-weight:600;margin:16px 0;line-height: 20px;}
.grid-tabs > .tab-item .tab-item-header{ margin:16px 0;}
.grid-tabs > .tab-item .tab-item-header h2{ font-family:var(--font-text-regular);}
.grid-tabs .faq-item .faq-item-body{overflow: hidden;display: grid !important;grid-template-rows: 0;transition: grid-template-rows 0.3s ease-in-out;transform: none;}
.grid-tabs .faq-item.open .faq-item-body {display: grid !important;grid-template-rows: 1fr;transition: grid-template-rows 0.3s ease-in-out;transform: none;}
.tab-faux{ margin:24px 0 16px 0;}
.tab-faux h2{ margin: 0;display: flex;justify-content: space-between;}
/*.tab-faux h2::after{ content:'';background: url("https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/icon-pdf.svg") no-repeat 50% 50%;display:inline-block;width: 18px;height:22px;*/
/* background-size: contain;vertical-align: bottom;}*/
.tab-faux h2 a { color:#000}
.tab-item {padding-bottom: 0;border-bottom: 1px solid #000;}
.fs-h1-mobile{ display: block;}
.tab-item .tab-item-title {display: flex;padding:24px 24px 0;background-color:#fdfdfd;border-bottom:1px solid #EAEAEA;z-index:9;transform: translateX(-100%);transition: transform 0.5s ease-in-out;width:100%;justify-content: space-between;position: fixed;top:202px;left:0;}
.header-sticky .tab-item .tab-item-title {top:137px;}
/*.tab-inner {margin-top:90px;}*/
/*.tab-inner > div{margin:0 24px;}*/
.tab-inner > div.full-row{margin:0;padding:0;}
.tab-inner .row.no-p { padding-bottom: 0;border-bottom:0;}
/*.tab-item.open .tab-item-title {transform: translateX(0%);transition: transform 0.5s ease-in-out;}*/
.tab-item.open .tab-item-title {display: none;}
.tab-item.open .tab-item-title::after {content: "";display: inline-block;flex-shrink: 0;width: 24px;height: 24px;background: url("https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/Close_Icon.svg") no-repeat 50% 50%;background-size: contain;}
.tab-item .tab-item-header {display: flex;justify-content: space-between;align-items: center;gap: 8px;cursor: pointer;margin:8px 0 11px;}
.tab-item .tab-item-header::after {content: "";display: inline-block;flex-shrink: 0;width: 14px;height: 8px;background: url("https://d1ctifminpgohi.cloudfront.net/icons/chevron-down.svg") no-repeat 50% 50%;background-size: contain;transition: transform 0.3s ease-in-out;}
.tab-item.open .tab-item-header::after {transform:scaleY(-1)}
.tab-item .tab-item-header h2 {display: block;font-size: 16px;margin:0;font-weight: 600;line-height: 24px;}
.tab-item .tab-item-header p {font-family: var(--font-text-medium);color: var(--color-black);}
/*.tab-item .tab-item-body {overflow-y: scroll;position: fixed;top:0;left:0;height: max-content;background-color: #fdfdfd;transform: translateX(-100%);transition: transform 0.5s ease-in-out;height: 100%;width: 100%;z-index: 9;}*/
/*.tab-item.open .tab-item-body {transform: translateX(0);transition: transform 0.5s ease-in-out;}*/
.tab-item .tab-item-body { position: static;overflow: hidden;display: grid;grid-template-rows: 0fr;transition: grid-template-rows 1s ease-in-out;transform: none;}
.tab-item.open .tab-item-body {grid-template-rows: 1fr;transition: grid-template-rows 1s ease-in-out;transform: none;padding-bottom:32px;}
.tab-item.open .tab-item-body p:last-child{ margin-bottom:0;}
.tab-inner {overflow:hidden;}
/**/
.tab-item .tab-item-body .faq-item:last-child{ border-bottom:0}
.tab-item img{ mix-blend-mode: multiply;}
.tab-item .tab-item-body h3 { margin:32px 0 16px;}
.tab-item.open .tab-inner div.first h3{ margin-top:0px;}
.tab-item .tab-item-body p, .tab-large p { margin:0 0 12px;}
.tab-item .tab-item-body p strong { color:#000;}
.tab-large{ margin:32px 0;}
.tab-large.faux { padding: 0;margin:48px 0;}
.tab-large.faux h2{ margin-top:0;display:block;}
.grid-tabs .tab-large:first-child { margin-top:48px !important;}
.tab-description div p:last-child { margin-bottom:0px;}
.tab-description a {color:#D3AE6F}
.tab-inner.tab-description-copy .first p:last-child{ margin-bottom:32px;}
.full-w-row {padding:0 24px;}
.tab-item .swatch-img{ max-width: 276px;margin:0 auto;display: block}
/*.tab-description p:last-child::before, a.icon-pdf:before{ content: '';width: 24px;height:31px;display: inline-block;margin-right:16px;background: url("https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/icon-pdf.svg") no-repeat 50% 50%;background-size: contain;vertical-align: text-bottom;}*/
.tab-downloads .description-links { display:flex;gap:24px;margin-top:24px;flex-direction: row;}
.tab-downloads .description-links a { flex-basis:33.33%;color:#C09A5F;font-size: clamp(12px, 0.3645rem + 0.6024vw, 16px);line-height:clamp(0.5rem, -0.0422rem + 2.4096vw, 1.5rem);text-transform: uppercase;background-color:#EDF0F0;flex-grow:1;padding:0;text-align:center;aspect-ratio: 88 / 59;display:flex;flex-direction:column;justify-content: center}
.tab-downloads .description-links a::before { content:'';width:100%;height:40px;background-image: url("https://d1ctifminpgohi.cloudfront.net/icons/icon-productguide.svg");background-repeat:no-repeat;background-position:bottom center;background-size:auto 40px !important;margin:0 auto 16px auto;display: block;}
.tab-downloads .description-links a.icon-installation::before { background-image: url("https://d1ctifminpgohi.cloudfront.net/icons/icon-installation.svg");}
.tab-downloads .description-links a.icon-layingpattern::before { background-image: url("https://d1ctifminpgohi.cloudfront.net/icons/icon-layingpattern.svg");}
.tab-downloads .description-links a.icon-video::before { background-image: url("https://d1ctifminpgohi.cloudfront.net/icons/product-look.svg");}
.tab-downloads .description-links a.icon-sample::before { background-image: url("https://d1ctifminpgohi.cloudfront.net/icons/product-sample.svg");}
.with-ellipsis span {display: block;align-items: center;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width:calc(100% - 24px);}
.with-ellipsis a { width:calc(100% - 24px);}
.hastestimonial p.with-ellipsis{ overflow: hidden;}
.tab-large h2{ font-size: 16px;font-weight: 600;line-height:24px;margin-bottom: 16px;}
.tab-item .grid-1-3{}
.grid-1-3 > div .row{border-bottom: 1px solid #D7D4D9;border-bottom: 0.5px solid #D7D4D9;padding-bottom: 32px;margin-bottom: 32px;}
.grid-tabs .tab-item-title h2 { margin-bottom:12px;}
.grid-1-3:last-child > div .row{ border-bottom:0;}
.grid-tabs .tab-item .grid-1-3 > div h3{ margin: 16px 0;}
.tab-item .grid-1-3 > div .row p:last-child{ margin-bottom:0;}
.tab-item .grid-1-3.row-grey{}
.tab-item .grid-1-3.no-b, .tab-item .grid-1-3:last-child{border-bottom: 0;}
img.w100{ width:100%;}
.tab-item .row-grey {margin-bottom:32px;}
.tab-item .row-grey div:nth-child(2){ padding:24px;}
.triangles-green, .triangles-orange{ padding-left:12px;}
.triangles-green { color:#000 !important;}
.triangles-green li, .triangles-orange li{margin-bottom:24px;
list-style-image: url('data:image/svg+xml,\
');
padding-left:12px;
}
.tab-co2 .triangles-green li { margin-left:5px;}
.triangles-orange li{
list-style-image: url('data:image/svg+xml,\
');
margin-bottom: 0;
line-height: 28px;
margin-left: 6px;
}
.triangles-green li:nth-child(2){
list-style-image: url('data:image/svg+xml,\
');
}
.triangles-green li:nth-child(3){
list-style-image: url('data:image/svg+xml,\
');
}
.triangles-green li:nth-child(4){
list-style-image: url('data:image/svg+xml,\
');
}
.triangles-green li:nth-child(5){
list-style-image: url('data:image/svg+xml,\
');
}
.tab-item .swiper-button-next:after, .tab-item .swiper-button-prev:after, .tab-large .swiper-button-prev:after, .tab-large .swiper-button-next:after{ display:none;}
.swiper-colours .swiper-slide p{ margin: 0 32px 32px 32px !important;flex-grow: 1;}
.swiper-colours .controls, .swiper-layingpatterns .controls, .swiper-extras .controls { display:none;flex-direction: row;column-gap:8px;align-items: end;margin-top:24px;}
.swiper-colours .controls .swiper-button-next, .swiper-colours .controls .swiper-button-prev, .swiper-layingpatterns .controls .swiper-button-next, .swiper-layingpatterns .controls .swiper-button-prev, .swiper-extras .controls .swiper-button-next, .swiper-extras .controls .swiper-button-prev { display:block;position:static;height:24px;width:24px;}
.swiper-colours .controls .swiper-pagination, .swiper-layingpatterns .controls .swiper-pagination, .swiper-extras .controls .swiper-pagination { display:block;position:static;text-align: right;}
.swiper-colours .controls .swiper-pagination .swiper-pagination-bullet, .swiper-layingpatterns .controls .swiper-pagination .swiper-pagination-bullet, .swiper-extras .controls .swiper-pagination .swiper-pagination-bullet { background-color: var(--color-gallery-darker);border-color: var(--color-gallery-darker)}
.swiper-colours .controls .swiper-pagination .swiper-pagination-bullet-active, .swiper-layingpatterns .controls .swiper-pagination .swiper-pagination-bullet-active, .swiper-extras .controls .swiper-pagination .swiper-pagination-bullet-active { background-color: var(--color-tangerine);border-color: var(--color-tangerine)}
.swiper-colours .swiper-slide, .swiper-layingpatterns .swiper-slide, .swiper-extras .swiper-slide {align-items: center;display: flex;flex-direction: column;height:auto;}
.swiper-extras .swiper-slide .ls-grid-price-wrapper {flex-grow: 1;}
.swiper-colours .swiper-slide picture, .swiper-layingpatterns .swiper-slide picture, .swiper-extras .swiper-slide picture {width: 100%;}
.swiper-layingpatterns .swiper-slide a { color:#555;display:flex;}
.swiper-layingpatterns .swiper-slide a:before { content:'';background: url("https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/icon-pdf.svg") no-repeat 50% 50%;display:inline-block;width: 18px;height:22px;background-size:18px 22px;margin-right:8px;}
.grid-tabs .tab-item .faq-item { margin:0 24px 32px 24px;padding-bottom:24px;}
.tab-faqs .tab-item-body .faq-item { padding-bottom:32px !important;margin-bottom:32px !important;}
.green-text{ color:#24A926 !important;}
.green-text.small{ font-size:16px !important;}
.gradient-green{ background: rgb(211,246,224);margin-bottom: 26px !important;}
.image-contactus { padding:24px;}
.tab-item .swiper-left .swiper-wrapper{flex-wrap: wrap;column-gap: 24px;row-gap: 24px;}
.tab-item .swiper-left .swiper-slide{flex-basis:calc(50% - 12px);}
.tab-item .swiper-left .swiper-slide p{font-size: 10px;margin:0 16px 16px;line-height:12px;}
.tab-item img{ max-width: none;}
.tab-item img.w100{ width:100%;}
button.whatsapp{background-color: #33CC33;color:#fff;padding:8px 12px;display: block;margin:0 0 16px;text-transform: none;border:0;font-family: var(--font-text-regular);min-width:190px;text-align:left;display: flex;font-size:16px;min-width:200px;align-items:center;height:40px;}
button.whatsapp::before{content: '';display:inline-block;width: 18px;height:18px;background: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/WhatsApp.svg');margin-right:12px;align-self:center}
.tab-item button.whatsapp:last-child{ margin-bottom: 0}
.tab-item .tab-item-body p.cont-whatsapp-buttons{margin:0;}
.table-specification{ background-color: #FDFDFD;font-size:12px;color:#4E5252;font-weight:400;font-family: var(--font-text-medium);}
.tab-spec .table-specification{ width:100%;font-size:12px;}
.table-overview{}
.table-specification tr{display: flex;flex-direction: row;}
.table-specification tr:last-child{}
.table-specification tr:nth-child(odd) {background-color: #EDF0F0;}
.table-specification tr th {padding:16px 8px;flex-basis:45%;}
.table-specification tr td {padding:16px 8px;flex-basis:55%;flex-grow: 1; }
.table-specification tr th {color:#000;font-weight:600;}
.table-specification td p{font-size:12px;color:#4E5252;font-weight:400;font-family: var(--font-text-medium);line-height:18px;margin-bottom:4px !important;}
.table-overview { width: 100%;font-size:12px;background-color: transparent;margin:0;}
.table-overview th{ min-width:50%}
.table-overview tr:nth-child(odd) {background-color: transparent;}
.table-overview tr:first-child { border-top:0;}
.table-overview tr:last-child { border-bottom:0;}
.table-overview tr:last-child td { padding-bottom:24px;}
.fs-clamp h1, .fs-clamp h2, .fs-clamp h3, .fs-clamp h4 { color: #000;}
.grid-also{max-width:1600px;grid-area: grid-also;overflow: hidden;width: 100%!important;padding:0;margin-left:24px;}
.grid-also h2{ margin: 0 0 24px;}
.grid-also .product-carousel__block{ width: 100%;}
.img-comp-container {position: relative;height: 308px; /*should be the same height as the images*/width:308px;margin:0 auto;}
.img-comp-img {position: absolute;width: auto;height: auto;overflow: hidden;box-sizing: border-box;}
.img-comp-overlay{width:308px;height:308px;border-right:1px solid #fff;}
.img-comp-img img {display: block;vertical-align: middle;box-sizing: border-box;mix-blend-mode: normal;width:308px;}
.img-comp-slider {position: absolute;z-index: 9;cursor: ew-resize;/*set the appearance of the slider:*/width: 86px;height: 86px;background: url("https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/comparison-slider.svg") no-repeat;border-radius: 50%;box-sizing: border-box;}
.wet-dry-cont div .copy {padding: 0 24px;}
.wet-dry-cont p.slide{ opacity: 0;transition-delay: 0s;transition-property: opacity;transition-duration: 0.01s;margin-top: 16px;left:48px;padding-bottom:0;font-size:10px;margin-left:24px;margin-bottom: 32px !important;}
.open .wet-dry-cont p.slide{ opacity: 1;transition-delay: 0.9s;}
.wet-dry-cont p.slide:before{ content:'';padding-left:18px;background: url('data:image/svg+xml,\
') no-repeat left center}
.bg-grey{ background-color: #F3F4F6;}
.wet-dry-cont .bg-grey { background-color: #FDFDFD;}
/*sliders*/
.zoom-icon {position: absolute;z-index: 99999999;bottom:0;right:0;height:70px;width: 100%;background: transparent;cursor:pointer;display: flex;align-items: end;justify-content: right;}
.zoom-icon span{color: #fff;flex-grow: 1;margin: 0 8px 8px 14px;font-size: 10px;width:100%;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
.zoom-icon img{margin:0 12px 12px 0;}
.product-carousel__image-holder { border-radius: 0;}
.product-carousel__image-holder img {border-radius:0;max-height: initial;max-width: initial;}
.carouselGallery li{background: #f7f7f7;}
.carouselGallery li img{border-radius: 0 !important;aspect-ratio: 90 / 91;object-fit: cover;height:auto !important;mix-blend-mode: multiply;}
.carouselGallery li img.contain{object-fit: contain;}
.carouselGallery li iframe{width:100%;aspect-ratio: 16 / 9;vertical-align: center;}
.carouselGallery li.video-slide{ background-color: #000;display:flex;align-items: center;aspect-ratio: 90 / 91;}
.carouselGallery li.video-slide li img{ aspect-ratio: auto;}
.carouselGallery li.video-slide a{ width:100%;}
.carouselGallery li.video-slide h3{ color:#fff;position:absolute;z-index: 9;}
.carouselGallery li.video-slide h3:first-child{ top:8%;left: 16px;}
.carouselGallery li.video-slide h3:nth-child(2){ bottom:32px;left: 16px;}
.carouselGallery li.video-slide h3:first-child span{ display: block;}
.carouselGallery li.video-slide h3:first-child span.regular{ font-family: var(--font-text-regular);}
.carouselGallery li.video-slide a.with-videolink:hover:before, .tab-item a.with-videolink:hover:before { background-image: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/hub_play_reverse.svg');}
.tab-large.hastestimonial{padding: 24px;border-bottom: 32px solid #EBEAEC;width:100vw;margin-left:-24px;}
.tab-large.hastestimonial .ls-product-testimonial__more{ color:#E59804;font-family: var(--font-text-medium);display:block;margin-top:16px;white-space: nowrap;}
.tab-large.hastestimonial .ls-product-testimonial__remains.open { display:inline;}
.tab-large.hastestimonial .hellip.open { display:none;}
.tab-large.hastestimonial .ls-product-testimonial__more::after { content: '';width: 24px;height: 24px;display: inline-block;background: url(https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/hub_chevron_right_orangearrow.svg);transform: rotate(90deg);margin-left: 16px;vertical-align: text-bottom;position:relative;z-index: -1;}
.ls-testimonial-text > p > span > img {position:relative;z-index: -1;}
.tab-large.hastestimonial .ls-product-testimonial__more:hover::after {background-image: url('https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/hub_chevron_right_orange.svg');}
.tab-large.hastestimonial .ls-product-testimonial__more.readless::after { transform: rotate(270deg)}
.hastestimonial .with-ellipsis { margin-bottom: 0;}
.hastestimonial .with-ellipsis > * { font-size:12px !important;line-height:20px;}
.hastestimonial .ls-testimonial-text p { font-size:20px;line-height:28px;letter-spacing:-0.1px;}
.svg-text{ font-family:var(--font-text-regular);font-size: 12px; }
.table-group-price {display:flex;flex-flow:column nowrap;width:calc(100% + 48px);font-size:12px;margin-left:-24px;background-color:#FDFDFD;}
.table-group-price tr, .table-group-price tr th, .table-group-price tr td {display:flex;}
.table-group-price tbody tr {border-bottom:1px solid #EDF0F0;color:#1D1D1F;}
.table-group-price tbody tr:nth-last-child(1 of :not(.hidden)) {border-bottom:0;}
.table-group-price tr th {font-family:var(--font-text-regular);font-size: 8px;color:#C09A5F;background-color:#E3E6E9;padding:12px 0;text-transform: uppercase;}
.table-group-price tr td {font-family:var(--font-text-medium);padding:12px 0;background-color:#FDFDFD;text-align: left;color:#1D1D1F;}
.table-group-price tr td.stk-col {display:none}
.table-group-price tr:last-child td {border-bottom:0;}
#products-recommended tr > td { align-items: flex-start;}
.table-group-price tr th:first-child, .table-group-price tr td:first-child {padding-left:24px;flex:2.25;}
.table-group-price tr th, .table-group-price tr td {flex:1;}
.table-group-price tr th:last-child, .table-group-price tr td:last-child {padding-right:24px}
.table-group-price tr td.multiple, .table-group-price tr th.multiple {flex:1.75;column-gap: 8px;justify-content: space-between;}
.table-group-price tr td input[type="number"] {flex-grow:1;height:24px;max-width: 60px;min-width:44px;}
.table-group-price tr td.multiple input[type="number"], .table-group-price tr th.multiple span {width:calc(50% - 32px);flex-grow:1;max-width: 60px;}
.table-group-price { }
.table-group-price.nosale {line-height:24px;}
.table-group-price.nosale tr {align-items: flex-start}
.table-group-price tr th { flex:1;}
.table-group-price tr th.multiple { flex:1.8;}
.table-group-price tr th:first-child { white-space: nowrap;flex:3}
#ls-variation-stk-head, .stk-col {display: none;}
.table-group-price tr td { align-self: center;flex:1;}
.table-group-price tr td:first-child { padding-left:24px;flex:3}
.table-group-price tr td:last-child { padding-right:24px;}
.table-group-price tr td.multiple { flex:1.8;}
.table-group-price tr td > span { align-content: center;color:#1D1D1F;}
.table-group-price tr td p { font-family:var(--font-display-medium);font-size:12px;}
.table-group-price tr td .input-text.qty{border: 1px solid #D9D9D9 !important;border: 0.5px solid #D9D9D9 !important;border-radius: 0;width:auto;width: -webkit-fill-available;height:20px;}
.table-group-price input[type="number"] {-moz-appearance: textfield;font-family:var(--font-text-medium);}
.table-group-price input[type="number"]::-webkit-inner-spin-button, .table-group-price input[type="number"]::-webkit-outer-spin-button {-webkit-appearance: none;margin: 0;}
.table-group-price .ls-product-nameblock { font-family:var(--font-text-medium);width:100%;min-height:20px;word-break: break-word;padding-right:4px;}
.table-group-price tr:last-child td { border-bottom:0}
.ls-product-nameblock {color:#1D1D1F;}
.ls-product-nameblock div {align-content: center}
.table-group-price input[type=checkbox],
.tangerine-checkbox-cont input[type=checkbox],
.tangerine-checkbox-cont input[type=radio] {display:none;}
.table-group-price input[type=checkbox] + label,
.tangerine-checkbox-cont input[type=checkbox] + label,
.tangerine-checkbox-cont input[type=radio] + label{background: url("https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/plus-cirlce-outline.svg") no-repeat 50% 50%;height: 16px;width: 16px;display:inline-block;padding: 0 0 0 0px;cursor:pointer}
.table-group-price input[type=checkbox] + label:hover,
.tangerine-checkbox-cont input[type=checkbox] + label:hover,
.tangerine-checkbox-cont input[type=radio] + label:hover{cursor: pointer;}
.table-group-price input[type=checkbox]:checked + label,
.tangerine-checkbox-cont input[type=checkbox]:checked + label,
.tangerine-checkbox-cont input[type=radio]:checked + label{background: url("https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/tick-circle-solid.svg") no-repeat 50% 50%;height: 16px;width: 16px;display:inline-block;padding: 0 0 0 0px;}
#products-recommended tr td:last-child div { width: 100%;}
.swiper-colours .swiper-wrapper, .swiper-layingpatterns .swiper-wrapper{ flex-direction: column;row-gap:32px;}
.swiper-layingpatterns .swiper-slide { height:auto!important;row-gap:16px;font-size: 16px;}
.swiper-layingpatterns .swiper-slide ul{ margin-top:8px;}
.swiper-layingpatterns .swiper-slide div{ width:calc(100% - 32px);}
.swiper-layingpatterns .swiper-slide div picture{ width: 100%;}
.swiper-layingpatterns .swiper-slide div:first-child{ padding:16px 0 0;}
.swiper-layingpatterns .swiper-slide div:last-child{ padding:16px 16px 0 16px;border-top:1px solid #E59804;margin:0 0 16px 0;}
.swiper-layingpatterns .swiper-slide div:nth-child(2){ flex-grow:1;display: flex;align-items:end;}
.swiper-extras .controls {display: none;}
.price_buttons{ padding: 0;margin: 36px 24px 24px 0px;width:100%;}
.price_buttons h3{ font-size:32px;align-self: center;font-weight: 600;margin-bottom:24px;}
.price_buttons h3 em{ font-size: 20px;margin-top:12px;font-style:normal;font-family:var(--font-text-regular);font-weight: 500;opacity:0.5;}
.price_buttons button {width:100%;}
#button-ordersample {color:#000;font-weight:600;text-decoration: underline;line-height: 20px;font-size:12px;display:flex;margin:24px 0 48px;}
#button-ordersample::before {content:'';background-image: url('https://d1ctifminpgohi.cloudfront.net/icons/icon-ordersample.svg');width: 19px;height:20px;background-size: contain;margin-right:16px;}
img.avatar { border-radius:100%;width:58px;height:58px;margin-bottom:16px;position:relative;z-index: -1;}
.cont-qc.desktop { display:none;}
.cont-qc.mobile { margin:12px 0 24px 0;display: none;}
.swiper-colours .swiper-wrapper { flex-direction: row;row-gap:24px;column-gap:24px;flex-wrap:wrap;}
.swiper-colours .swiper-wrapper .swiper-slide{ flex-basis:calc(50% - 12px);padding:0}
.swiper-colours .swiper-slide p { margin:0px 16px 16px !important;font-size:10px;line-height:16px;align-self: flex-start}
.grid-nav ul li a { color:#000;white-space: nowrap}
.tab-colour #colour-variation{ margin-top:32px;}
.tab-colour .disclaimer{ margin:32px 0 !important;}
.tab-colour .disclaimer:before { content: '';display: inline-block;width: 10px;height: 10px;background-size: 10px 10px;margin-right: 8px;background-image: url('data:image/svg+xml, ');align-self: center;transform: rotate(90deg)}
.tab-sealing .row-grey p, .tab-installation .row-grey p, .tab-cleaning .row-grey p, .tab-delivery .row-grey p { margin-bottom:0;}
.grid-tabs > .tab-item .tab-item-title h2 { font-size: 24px;}
.tab-faqs h4, .tab-contact h4, .swiper-layingpatterns .swiper-slide h4 , .grid-also h2{ font-size: 20px;line-height:28px;}
.tab-hd .cont-video { margin-bottom: 32px !important;}
.grid-pic > div div{ padding:24px}
.grid-pic .pic-bg { display: none;}
.tab-co2 .grid-1-3:last-child, .tab-co2 .green-text { margin-bottom:32px !important;}
.tab-co2 .grid-1-3.first > div h3 { margin-bottom:8px;}
.grid-1-3 > div .row.no-pd {padding-bottom:0;}
h3.pad-top{ border-top:0;}
.grid-also .product-carousel__text {margin-top:24px;}
.grid-also .product-carousel__text a { color:#000;font-size: clamp(20px, 0.9789rem + 1.2048vw, 28px);font-weight:600;line-height: clamp(28px, 0.9789rem + 1.2048vw, 36px);min-height:56px;letter-spacing:normal;}
.grid-also .product-carousel__text a .grey-text { color:#555;font-family: var(--font-text-regular);display: block;}
.grid-also .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, .grid-also .ls-price-prefix { font-size:16px !important; color:#4E5252;font-style:normal;font-family: var(--font-text-regular);letter-spacing: -0.08px;}
.grid-also .product-carousel__text + .ls-grid-price-wrapper .ls-grid-price { margin: 16px 0 24px 0;}
.grid-also h2 { font-size:24px;}
.tab-faqs .faq-item .faq-item-header { align-items: flex-start;}
.tab-faqs .faq-item .faq-item-header::after{ margin-top: 12px;}
.tab-contact a {color: var(--color-emperor);text-decoration: underline;transition: color 0.3s ease-in-out;}
.tab-contact a:hover {color:var(--color-black);}
.products_oos {background-color: #FDFDFD;color:#555;font-family:var(--font-text-regular);padding:24px 12px;font-size:16px;letter-spacing: -0.08px;line-height:24px;margin:16px 0 32px 0;}
.products_oos strong {color:#000;font-family:var(--font-text-medium);}
.swiper-thumbs {display: none;}
.grid-also .product-carousel__image-holder {aspect-ratio: 1 / 1;}
/*why coose*/
.cheshire-hp {margin: 0 auto;margin-top: clamp(48px, 5vw, 64px);max-width: 1600px;container-type: inline-size;}
.choose-cheshire {grid-area:why-choose;z-index: 2;}
.choose-cheshire h2 {font-weight: 600;}
.choose-cheshire .hp-dark-txt.section-heading {font-size: clamp(20px,1.8vw,28px);letter-spacing: -0.7px;}
.choose-cheshire .hp-paving-slabs-wrap h2 {margin-top:clamp(24px,2vw,32px);color:#000;}
.cheshire-hp.choose-cheshire {background: #EDF0F0;margin:0 0 0 -24px;width: 100vw;padding: clamp(48px,4vw,64px) 24px;margin-top: clamp(48px, 4vw, 64px);}
.cheshire-hp .hp-paving-slabs-wrap{display: flex;flex-direction: column;gap: clamp(24px, 1.8vw, 32px);margin-top: clamp(24px,2.5vw,48px);}
.cheshire-hp.choose-cheshire .hp-paving-slabs-wrap{justify-content: center;flex-direction: row;flex-wrap: wrap;}
.cheshire-hp.choose-cheshire .hp-paving-slab{max-width: 272px;text-align: center;flex-basis: 44%;}
.cheshire-hp.choose-cheshire .hp-paving-slabs-wrap .hp-paving-slab:nth-child(3){flex-basis: 43%;}
.cheshire-hp.choose-cheshire .hp-paving-slab img{width: auto;max-width: auto;height: clamp(48px,4vw,64px);}
.cheshire-hp.choose-cheshire .hp-dark-txt.section-heading{text-align: center;padding: 0 24px;color:#000;}
.cheshire-hp.choose-cheshire .hp-dark-txt:not(.section-heading){font-size: clamp(16px,1.5vw,24px);line-height: clamp(24px,2vw,28px);font-weight: 600;letter-spacing: -0.7px;}
.cheshire-hp.choose-cheshire .hp-light-txt{font-size: clamp(12px, 0.6145rem + 0.6024vw, 16px) !important;line-height: clamp(20px,1.8vw,24px);font-weight: 400;letter-spacing: -0.5px;color:#4E5252}
.cheshire-hp.choose-cheshire .hp-card-link{display: inline-block;color: #C09A5F;font-size: 16px;line-height: clamp(20px,1.8vw,24px);font-weight: 400;margin-top: clamp(16px,1.5vw,32px);}
.grid-also a.button { width: fit-content;padding:0 32px;}
.product-page-grid .choose-cheshire.cheshire-hp {margin:0;}
.main-product-filter-container .choose-cheshire.cheshire-hp {margin-top: clamp(48px, 5vw ,64px)}
.ls-pn-del { background-color:#FDFDFD;font-size:16px !important;color:#4E5252;line-height: 20px;letter-spacing: -0.8px;border:0 !important;padding:0 !important;margin-top:32px;}
.ls-pn-del strong {color:#000;font-weight:600 !important;}
.ls-pn-del a {text-decoration: underline;}
.ls-pn-del span {border:0 !important;letter-spacing: -0.8px !important;padding:0 !important}
.ls-pn-del img+span span{color:#000; font-weight: 600;}
.ls-pn-del{
display: none;
}
.ls-pn-del.mobile {
display: flex;
background: #EDEFF0;
margin: 0 -24px;
padding: 24px 0 !important;
}
.ls-pn-del.mobile > span {
margin: 0;
background: #FDFDFD;
padding: 16px 24px !important;
}
.product-listing-container-column {margin-top: 64px;padding-top: 0;}
#resultCount{padding-bottom: 24px;border-bottom:1px solid #D1D6DA;}
.products-grid__filter--results > div > div span {color:#C09A5F;}
.main-product-filter-container .choose-cheshire.cheshire-hp { margin-left: calc(-50vw + 50%);margin-right: calc(-50vw + 50%);width: auto;max-width: none;}
@container (inline-size > 621px){
.cheshire-hp.choose-cheshire .hp-paving-slabs-wrap{
justify-content: space-around;
}
}
@container (inline-size > 850px){
.cheshire-hp.choose-cheshire .hp-paving-slabs-wrap{
flex-wrap: nowrap;
justify-content: center;
}
.cheshire-hp.choose-cheshire .hp-paving-slab, .cheshire-hp.choose-cheshire .hp-paving-slabs-wrap .hp-paving-slab:nth-child(3){
flex-basis: auto;
}
}
@media (min-width: 550px) {
.grid-tabs > .tab-item .tab-item-title { top:150px;}
.header-sticky .grid-tabs > .tab-item .tab-item-title { top:68px;}
.tab-downloads .description-links a::before {height:64px;background-size: auto 64px !important;}
}
/*Responsive 575*/
@media (min-width: 570px) {
.tab-faqs .faq-item h4 { font-family: var(--font-display-medium) !important;}
.tab-co2 ul li strong { font-family:var(--font-display-medium);}
.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, .grid-also .ls-price-prefix { font-family: var(--font-display-regular);}
}
@media (min-width: 575px) {
.carouselGallery li img{
aspect-ratio: 3 / 2;
}
.carouselGallery li iframe{
width:100%;
aspect-ratio: 16 / 9;
}
.carouselGallery li.video-slide{ aspect-ratio:3 / 2;}
.swiper-colours .swiper-wrapper, .swiper-layingpatterns .swiper-wrapper{ flex-direction: row;row-gap:32px;column-gap:32px;flex-wrap:wrap;}
.swiper-layingpatterns .swiper-wrapper .swiper-slide { flex-basis:calc(50% - 16px);}
.swiper-colours .swiper-wrapper .swiper-slide{ flex-basis:calc(50% - 16px);}
.swiper-colours .swiper-slide p { margin:0px 24px 24px !important;font-size:12px;line-height:12px;min-height: 36px;}
}
/* Responsive 768 */
@media (min-width:768px){
.page-product-grouped #maincontent{ padding: 0;}
.tab-large.hastestimonial { padding:32px}
.tab-downloads .description-links a{ font-size: 16px;max-height: 125px;}
.tab-downloads .description-links a::before{margin-bottom: 24px;height: 40px;background-size: 40px !important;}
.green-text.small{ font-size:24px !important;}
.grid-tabs > .tab-item .tab-item-title h2 { font-size: 28px;}
/*.grid-tabs > .tab-item .tab-item-body h3, .tab-faqs h4, .tab-contact h4 { font-size: 24px;}*/
.grid-tabs > .tab-item .tab-item-title { top:206px;}
.header-sticky .grid-tabs > .tab-item .tab-item-title { top:120px;}
.wet-dry-cont .bg-grey { background-color: #F3F4F6;padding:24px !important;}
.wet-dry-cont div .copy { padding:0;}
.tab-faux{ margin:32px 0 24px 0;}
.zoom-icon {position: absolute;z-index: 99999999;bottom:0;right:0;height:34px;width: 100%;background: transparent;cursor:pointer;display: flex;align-items: end;justify-content: right;}
.zoom-icon span{ display:inline-block;margin:0 12px 12px 12px;font-size:12px;}
#slide-caption { display:none;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;width: calc(100% - 75px);color:#fff;font-size: 12px;}
.tab-large { padding:0;}
.hastestimonial .ls-testimonial-text p { font-size:20px;line-height:28px;letter-spacing:-0.1px;}
.hastestimonial .with-ellipsis > * { font-size:16px !important;line-height:24px;}
.tab-large.hastestimonial .ls-product-testimonial__more{ display:inline;margin-top:0;}
.tab-description .description-links { margin-top:32px;}
.tab-item .grid-1-3{padding-bottom: 0;overflow: hidden;border-bottom: 0;border-bottom:0;}
.tab-inner.tab-description-copy .first p:last-child{ margin-bottom:24px;}
.tab-inner .row.no-p { padding-bottom: 0;border-bottom:inherit;}
.tab-inner .grid-1-3 .pad-top { padding-top:24px;}
.tab-inner .grid-1-3 .bor-top { border-top:1px solid #D7D4D9;border-top:0.5px solid #D7D4D9;}
.tab-about .tab-inner .grid-1-3 .bor-top{ border-top:0;}
.tab-about .tab-inner .grid-1-3 .pad-top{ padding-top:0;}
.grid-pic img{ aspect-ratio: 86 / 68;height:100%;}
.tab-item .faq-item{ padding-bottom:24px !important;}
.tab-item .faq-item:last-child{ padding-bottom:0 !important;}
.faq-item{ padding-bottom:24px !important;}
.tab-item .swatch-img { max-width: none;width:275px;margin-left:-24px;}
.tab-hd .grid-3-1 > div{ display: block;}
.grid-3-1 > div{grid-template-columns: 3fr 1fr;}
.grid-4-6 > div{grid-template-columns: 4fr 6fr;}
.tab-item .grid-1-3:last-child .row{border-bottom:0;margin-bottom:0;}
.grid-1-3 > *:nth-child(odd){grid-column: 1 / span 1;}
.grid-1-3 > *:nth-child(even){grid-column: 2 / span 1;}
.grid-tabs .tab-item .grid-1-3 > div h3{ margin-top:0;}
.grid-also h2 {font-size:clamp(1.6rem, 0.98vw + 1.373rem, 2rem)}
.grid-also h2 {font-size:20px;}
.tab-item .row-grey div:nth-child(2){ padding: 24px 24px 0 0 ;}
.img-comp-container {position: relative;height: 308px; /*should be the same height as the images*/width:308px;margin: 0 auto 0 0;}
.img-comp-overlay{width:308px;height:308px;border-right:1px solid #fff;}
.open .wet-dry-cont p.slide{ margin-left:0;}
.carouselGallery li.video-slide h3:first-child{ top:32px;left: 24px;}
.carouselGallery li.video-slide h3:nth-child(2){ bottom:32px;left: 24px;}
.grid-form .product-add-form { margin:0;padding:0 24px;}
/*#ls-variation-stk-head, .stk-col {display: flex;}*/
.tab-item .tab-item-title { top:206px;}
.header-sticky .tab-item .tab-item-title { top:118px;}
.tab-description .description-links { flex-direction: row;}
.table-specification tr th, .table-specification tr td { font-size: 16px;padding:16px;}
.table-specification tr td p { margin-bottom:4px !important;font-size: 16px;}
.table-specification tr td p:last-child { margin-bottom:0px !important}
.grid-form #productFromPrice{ margin-bottom:32px;order:2;font-size: 16px;line-height:24px;}
.grid-form #productName{ line-height:36px;margin-bottom: 24px;}
.table-group-price tr th:first-child, .table-group-price tr td:first-child { flex:5;}
.grid-pic > div div{ padding:24px 24px 24px 0;}
.grid-pic .pic-bg{ display: block;min-height:140px;}
.tab-sealing .bg-grey > div, .tab-installation .bg-grey > div, .tab-cleaning .bg-grey > div, .tab-delivery .bg-grey > div{ display:grid;grid-template-columns: 1fr 1fr;column-gap:24px;}
.tab-sealing img, .tab-installation img, .tab-cleaning img, .tab-delivery img{ display:none;}
.tab-sealing .pic-bg{ background-image:url(https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/tab-sealing.jpg);background-size: cover;background-position:top center;}
.tab-installation .pic-bg{ background-image:url(https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/tab-installation.jpg);background-size: cover;background-position:top center;}
.tab-cleaning .pic-bg{ background-image:url(https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/tab-cleaning.jpg);background-size: cover;background-position:top right;}
.tab-delivery .pic-bg{ background-image:url(https://d3przyomkgkv0c.cloudfront.net/mediadev/media/cms-pages/tab-delivery.jpg);background-size: cover;background-position:top center;}
.grid-tabs .pic-bg {min-height:216px }
.tab-co2 .grid-1-3.first > div { display:grid;grid-template-columns:1fr 2fr;}
.tab-co2 .grid-1-3.first .row.no-pd { border-bottom:0;}
.tab-co2 ul li strong { display: block;font-size:24px;margin-bottom:16px;}
.tab-co2 img.w100 { width:39%;}
.tab-co2 .first { border-bottom:1px solid #D7D4D9;border-bottom:0.5px solid #D7D4D9;margin-bottom:32px;}
.tab-co2 .first h3 { margin-bottom:0 !important;}
.tab-co2 .triangles-green li { margin-bottom:32px;max-width: 520px;}
.image-contactus p:first-child{ max-width:500px;}
.grid-form .fs-h1-mobile, .grid-form .fs-h1-mobile span { font-size:clamp(1.6rem, 0.98vw + 1.373rem, 2rem)}
}
/*Responsive 1024*/
@media (min-width: 1024px) {
.grid-image {transition: height 1s ease-in-out;}
.grid-image > div {height: fit-content;}
.product-page-grid > .title-price{ display: none;}
.product-page-grid h1 { font-size:28px !important;line-height: 32px}
.grid-form > .title-price{ display: block;}
.page-product-grouped #maincontent {margin:0 24px;}
:root { interpolate-size: allow-keywords}
.triangles-orange li {margin-left:5px;}
.tab-large.tab-downloads{
margin-top: 48px;
}
.grid-container, .grid-container-lg, .breadcrumbs-cont, .page-products .breadcrumbs { padding:0;}
.grid-tabs { padding:0;}
.grid-tabs p {font-size:16px;margin-bottom:16px;line-height:24px}
.grid-tabs h3 {font-size:16px;margin-bottom:16px;line-height:24px;font-weight:600;}
.tab-item .tab-item-body h3:first-child{margin-top:0;}
.grid-tabs > .tab-item .tab-item-header h2 {font-family: var(--font-display-medium);}
.grid-also { padding:0;}
.tab-co2 .tab-inner .grid-1-3:last-child > div > div:first-child{display: none;}
.tab-co2 .grid-1-3.first > div { display:grid;grid-template-columns:1fr 1.4fr;}
.tab-co2 .grid-1-3.first .row.no-pd { border-bottom:0;}
.tab-co2 ul li strong { display: block;font-size:16px;margin-bottom:0;}
.tab-co2 img.w100 { width:50%;}
.tab-co2 .first { border-bottom:1px solid #D7D4D9;border-bottom:0.5px solid #D7D4D9;margin-bottom:32px;}
.tab-co2 .first h3 { margin-bottom:0 !important;}
.tab-co2 .triangles-green { margin-top:0;}
.tab-co2 .triangles-green li { margin-bottom:0 !important;}
.tab-co2 h3, .green-text.small {font-size: 20px !important;}
.tab-co2 img.w100 { width:100%;}
.tab-co2 picture { grid-column:1 / span 1 !important;width: calc(50% - 26px);margin-top:0;}
.tab-co2 .grid-1-3:last-child{ margin-bottom:0 !important;}
.tab-large.hastestimonial { padding:32px 0;margin-left: 0;width:100%}
.tab-large.hastestimonial .ls-product-testimonial__more{ display: inline;}
.table-group-price{ width:100%;margin:0;}
.table-group-price tr th:first-child, .table-group-price tr td:first-child { flex:3;}
.desktop-rhs-fill {grid-area:grid-fill;}
.product-page-grid {padding:0;display: grid;grid-template-columns: calc(100% - 504px) 480px;grid-template-rows: 1fr;grid-column-gap: 24px;grid-row-gap: 0px;
grid-template-areas:
"grid-image grid-actions"
"grid-image grid-nav"
"grid-image grid-tabs"
"grid-image grid-fill"
"grid-also grid-also"
"why-choose why-choose"
}
.grid-form #productName {
margin-bottom: 32px;
}
.grid-image, .grid-actions, .grid-tabs{width: auto;}
.table-group-price tr td { font-family:var(--font-text-medium);color:#000;}
.grid-actions{ background-color: transparent;}
/*.grid-tabs h2{ margin-bottom: 0;}*/
.grid-tabs > .tab-item { }
.grid-tabs > .tab-item .tab-item-header{ margin:0;padding-top:16px;}
.grid-tabs .faq-item.open, .grid-tabs .faq-item { margin:0 0 24px 0 !important;}
.grid-tabs .tab-large:first-child { margin:64px 0 32px 0 !important;}
.grid-nav ul li span:first-child{ display: none;}
.swiper-colours .swiper-wrapper, .swiper-layingpatterns .swiper-wrapper{ flex-direction: row;row-gap:0;column-gap:0;flex-wrap:nowrap;}
.slider-colour-variation{ margin-top: 32px;}
.swiper-colours .swiper-wrapper .swiper-slide, .swiper-layingpatterns .swiper-wrapper .swiper-slide {display: flex;flex-direction:column;row-gap:8px;flex-basis:auto;}
.tab-colour .disclaimer{ display: none}
/*.swiper-colours .swiper-wrapper .swiper-slide{ padding:32px;}*/
.swiper-layingpatterns .swiper-wrapper .swiper-slide{ row-gap: 38px;}
/*.slider-colour-variation .swiper-slide img{ mix-blend-mode: multiply}*/
.swiper-colours .swiper-slide p{ margin:48px 32px 32px !important;}
.grid-tabs .tab-item .grid-1-3 > div h3 { margin:0;}
.grid-tabs .tab-item .grid-1-3 > div h3.pad-top { padding-top:32px;border-top:0;}
.grid-1-3 > div{display: grid;grid-template-columns: 1fr;grid-template-rows: 1fr;row-gap: 24px;}
.grid-3-1 > div{grid-template-columns: 1fr;}
.grid-1-3 > div .row{padding-bottom: 32px;margin-bottom: 32px;}
.tab-about .grid-1-3.no-b.full-row { margin-top:6px;}
.tab-inner .grid-1-3 .row.pad-top { padding-top:0px;border-top:0;}
.tab-inner .grid-1-3 h3.pad-top { border-top:1px solid #D7D4D9;border-top:0.5px solid #D7D4D9;}
.grid-pic > div{grid-template-columns: 1fr 2fr;column-gap:24px;}
.tab-spec .table-specification tr th{ flex-basis:35%;padding:16px;}
.tab-spec .table-specification tr td{ flex-basis:65%;padding:16px;}
.grid-tabs .pic-bg { min-height: auto;}
.grid-4-6 > div{grid-template-columns: 4fr 6fr;}
.grid-376-1{display: grid;grid-template-columns: 1fr;grid-template-rows: 2fr;padding-bottom: 32px;margin-bottom: 32px;column-gap: 32px;}
.grid-376-1 > div:last-child {padding: 8% 32px 32px 0;}
.wet-dry-cont div .copy {padding: 0;}
.flex-row{ display: flex;flex-direction: row;}
.flex-row.about{ padding:0 16px 0 0;}
.flex-row.about > div:first-child { flex:0 0 40%}
.flex-row.about > div:first-child img { max-width: none;min-width: auto;width:100%;margin-left:0;}
.swiper-gallery-pagination-holder{ padding:32px 0;background-color: transparent;}
.open .wet-dry-cont p.slide{ left:calc(50% - 210px)}
.grid-form { padding:32px;background-color: #EDF0F0;position: relative;overflow-x:hidden;overflow-y:auto;}
.grid-form #productName { font-family: var(--font-display-medium) !important;font-size: 28px !important;line-height: 40px;font-weight:600;}
.grid-form #productName span { font-size: 28px !important;display: block}
.grid-form .cont-flex{ display: flex;flex-direction: column;padding-bottom:0;}
.grid-form h1.fs-h2{ margin-bottom:8px;order:1;margin-top:0;font-size: clamp(1.25rem, 1.0322rem + 0.968vw, 2rem);line-height:40px;}
.grid-form #productFromPrice span.fs-h2{ font-size:32px;}
.grid-form .carbon-text{ order:4;margin-bottom:32px;}
.grid-form .carbon-text p{ font-size: 12px;margin-top:12px;height:29px;padding-left:44px;background-size: 31px 28px;}
.grid-form .carbon-text h4{ display: block;border-bottom:1px solid #D7D4D9;padding-bottom:12px;}
.grid-form .delivery-text{ order:3;margin-bottom: 32px;font-size: 16px;letter-spacing: -0.8px;align-items: center}
.grid-form .description-text{ order:5;padding-top: 24px;margin-bottom:43px;border-top:1px solid red}
.grid-form .also-text{ order:6;}
.grid-form .also-text h4{ margin-bottom:20px;border-bottom:1px solid #D7D4D9;padding-bottom:12px;}
.grid-form .showroom-text{ order:7;}
.grid-form .online-text{ order:8;}
.grid-form .outofstock-text{ order:9;}
.tab-item .swiper-left .swiper-wrapper{
flex-wrap:nowrap;column-gap: 0;row-gap: 0;}
.open_product_qc {margin:0;height:32px;width: 32px;min-height: auto;background-size: 32px 32px }
.grid-nav { display: block;top:156px;z-index:100;}
.header-sticky .grid-nav { top:72px;}
.table-overview { width: calc(100% - 32px);font-size:16px}
.table-overview th{ min-width:42%}
.grid-form .onmobile, .grid-tabs .onmobile{display: none;}
.grid-form .product-add-form{background-color: transparent;padding: 0;margin-top:0;overflow:visible;}
.table-group-price tr td.multiple input[type="number"] {height:24px;}
.tab-item .swatch-img{ max-width: none;min-width: 263px;}
.tab-item { padding-bottom: 16px;border-bottom: 1px solid #000;}
.tab-item p{ padding-left:0;}
.tab-item .tab-item-title{ display: none;}
.tab-item.open .tab-item-title { display: none;}
.tab-item .tab-item-header { display: flex;justify-content: space-between;align-items: center;gap: 8px;cursor: pointer;margin:32px 0 0 0;transform: margin-bottom(0);transition: all 1s;}
.grid-tabs .tab-item .tab-item-header h2, .grid-also h2, .tab-large h2 { font-size: 20px;}
.grid-also h2{ font-size: 28px;}
.grid-tabs .tab-large h2 { margin-bottom:24px;}
.tab-item .tab-item-header::after { content: "";display: inline-block;flex-shrink: 0;width: 21px;height: 11px;background: url("https://d1ctifminpgohi.cloudfront.net/icons/chevron-down.svg") no-repeat 50% 50%;background-size: contain;transition: transform 0.3s ease-in-out;}
.tab-item .tab-item-header p { font-family: var(--font-text-medium);color: var(--color-black);}
.tab-item .faq-item { margin-right:0;margin-left:0;}
.tab-item .tab-item-body { position: static;overflow: hidden;display: grid;grid-template-rows: 0fr;transition: grid-template-rows 1s ease-in-out;transform: none;}
.tab-item.open .tab-item-body {grid-template-rows: 1fr;transition: grid-template-rows 1s ease-in-out;transform: none;padding-bottom:32px;}
.tab-item.open .tab-item-body p:last-child{ margin-bottom:0;}
.tab-inner{ overflow: hidden;padding:0;}
.tab-inner > div{margin:0;}
.tab-item.open{position: static;padding:0;overflow-y: auto;overflow-x: hidden;height:auto;}
.tab-item.open .tab-inner {padding:0;margin-top:0 !important;}
.tab-item.open .tab-item-header {margin-bottom: 24px;}
.tab-item.open .tab-item-header.mb-0 {margin-bottom: 0;}
.tab-item.open .tab-item-header::after {transform: scaleY(-1);}
.tab-item.open .tab-item-body .faq-item .faq-item-header::after{ width: 12px;height:10px;margin-right:5px;}
.tab-item .grid-1-3:last-child .row{ padding-bottom: 0;}
.tab-inner {margin-top:0;}
.tab-item .faq-item:last-child{ margin-bottom:0 !important;}
.full-w-row {position: static;width:100%;}
.gradient-green{background: rgb(211,246,224);background: linear-gradient(180deg, rgba(255,255,255,0) 32px, rgba(211,246,224,1) 32px, rgba(211,246,224,1) 100%);}
.tab-item.open .tab-item-body .gradient-green .grid-1-3 h3{}
.tab-item .row-grey div:nth-child(2){ padding: 16px 16px 16px 0 ;}
.image-contactus{background: url('https://d3przyomkgkv0c.cloudfront.net/fit-in/448x448/filters:format(.webp)/filters:quality(75)/mediadev/media/cms-pages/faq_staff_desktop2x.png') no-repeat 155% 100%;background-size: contain;padding:0 0 16px 24px;}
.image-contactus p:first-child{ max-width:65%;}
.image-contactus .grid-1-3{padding-top:48px;}
.swiper-colours .controls, .swiper-layingpatterns .controls, .swiper-extras .controls { display: flex;}
/*.zoom-icon {position: absolute;z-index: 99999999;bottom:0;right:0;height:34px;width: 34px;background: transparent;cursor:pointer;display: flex;align-items: end;justify-content: right;}*/
.zoom-icon img{margin:0 12px 12px 0;}
.product-add-form {position: initial;width: 100%;}
/*.tab-large, .tab-large.faux{ padding: 32px 0;border-bottom: 1px solid #AEAEAE;}*/
.tab-large p:last-child{ margin-bottom:0;}
.tab-large.hastestimonial {position: initial;width: 100%;border-bottom: 1px solid #AEAEAE;}
.tab-large.hastestimonial .ls-testimonial-people{display: flex;flex-direction: row;width:100%;}
.tab-large.hastestimonial .ls-testimonial-people picture img{ width:76px;margin-right:32px;}
.tab-large.hastestimonial p.with-ellipsis { flex-grow:1;margin-bottom: 0;align-self:center;}
.hastestimonial .with-ellipsis span { font-size:24px !important;line-height:32px;}
.hastestimonial .with-ellipsis a span { font-size:16px !important;line-height:20px;}
.hastestimonial .ls-testimonial-text p { font-size:28px;line-height:40px;letter-spacing:-0.32px;}
.grid-also .product-carousel__image-holder img {min-height: 376px;}
.grid-pic img {aspect-ratio: auto;height:100%;}
.grid-also{ width: 100% !important;background-color: var(--site-background-color);z-index: 2;margin:0;}
.grid-also .tab-large{ margin:64px 0 0;padding:0;border-bottom:0;}
.grid-also .tab-large h2{ margin: 0 0 48px;display: block}
.grid-also .product-item img{ aspect-ratio: 1 / 1;min-height: unset;}
.grid-form .product-add-form { margin:0;}
.trigreen > div{ grid-template-columns: 1fr;}
.triangles-green{ display: flex;flex-wrap: wrap;flex-direction: row;width: 100%;column-gap: 18px;row-gap: 24px;padding:0;margin-top:70px;}
.triangles-green li{ flex-basis:calc(50% - 26px);margin: 0 0 0 17px;padding-left:9px;}
.triangles-green li strong{ display: block;}
.cont-paypal > div > span{ padding:12px 0 9px 37px;}
.swiper-layingpatterns .swiper-slide {column-gap:40px;}
.swiper-layingpatterns .swiper-slide div{ width:calc(100% - 64px);padding:0;}
.swiper-layingpatterns .swiper-slide div:first-child{ width:100%;margin:32px 0 0;}
.swiper-layingpatterns .swiper-slide div:first-child > *{ margin-left:32px}
.swiper-layingpatterns .swiper-slide div:last-child{ width:100%;padding:16px 0;}
.swiper-layingpatterns .swiper-slide div:last-child a{ margin-left:32px}
.carouselGallery li.video-slide h3:first-child{ top:30px;left: 32px;}
.carouselGallery li.video-slide h3:nth-child(2){ bottom:32px;left: 32px;}
img.avatar { width:76px;height:76px;margin-bottom:0;}
.cont-qc.desktop { display:none;}
.cont-qc.mobile { display:none;}
.grid-340-1 > div:first-child{padding: 16px 16px 0 16px;}
.tab-wet-dry .grid-340-1 > div:first-child{padding: 0;}
.wet-dry-cont p.slide { margin-left:0;}
/*.tab-hd p:first-child{ margin-bottom:32px;}*/
.swiper-colours .swiper-wrapper .swiper-slide{ border:0.5px solid #F3F4F6;}
.swiper-colours .swiper-wrapper .swiper-slide:hover{ border:0.5px solid #E59804;}
.swiper-colours.pagination-outside { padding:0;}
.tab-installation .table-specification tr, .tab-sealing .bg-grey > div, .tab-installation .bg-grey > div, .tab-cleaning .bg-grey > div, .tab-delivery .bg-grey > div { column-gap:32px;}
.tab-faqs .faq-item h4 { font-size:16px !important;font-family:var(--font-text-medium) !important}
.tab-contact .grid-1-3 { margin-top:32px;}
.swiper-thumbs {display: block;margin:32px 0;}
.price_buttons h3 em {display: inline;}
.tab-description .description-links { flex-wrap:wrap;column-gap: 32px;}
.tab-downloads .description-links {gap:32px;}
.tab-downloads .description-links a {height:auto;padding:22px 0 28px 0;max-height: 150px;}
.tab-downloads .description-links a::before {padding:0;font-size:12px;height:64px !important;width:100% !important;background-repeat: no-repeat;background-position: bottom center;background-size: 100% 48px !important;margin:0 auto 24px auto;}
#button-ordersample {font-size:16px;line-height: 32px;}
#button-ordersample::before {width: 30px;height:32px;margin-right:24px;}
.grid-also .product-carousel__info > a {width:fit-content;padding:0 32px;}
.price_buttons {display:flex;justify-content:space-between;margin:32px 0 0;}
.price_buttons h3 {flex:2 2 100%;padding: 0;margin:0;}
.price_buttons button {flex:1 1 25%;padding:0 32px !important;height:44px;}
.price_buttons button span {white-space: nowrap;}
/*.grid-also .product-carousel__text a {font-size: 28px;}*/
/*why coose*/
.whychoose {width: calc(100% + 48px);margin-left:-24px;padding:64px 24px;}
.whychoose h2 {font-size: 40px;line-height: 44px;margin-bottom:48px;}
.whychoose h3 {font-size: 24px;line-height: 32px;margin-bottom:24px}
.whychoose ul {flex-wrap: nowrap;column-gap:32px;row-gap:0;flex-shrink:0;margin:0 24px;justify-content:center}
.whychoose ul li {flex-basis:calc(25% - 32px);max-width: 272px;}
.whychoose ul li img {width: 31.618%;}
.whychoose ul li p {margin-bottom: 16px;}
.whychoose ul li a {font-size:16px;color:#C09A5F;font-weight:600;}
.product-page-grid .delivery-text > span {margin-top:0;}
.product-page-grid .delivery-text, .product-page-grid .delivery-text #productLead, .product-page-grid .delivery-text #productLead strong {color:#4E5252;}
.table-group-price tr th {font-size: 12px;}
.table-group-price tr th:first-child, .table-group-price tr td:first-child { padding-left: 16px !important;}
.table-group-price tr th:last-child, .table-group-price tr td:last-child { padding-right: 16px !important;}
.swiper-extras .controls { display: none;}
.ls-pn-del {font-size: 16px;line-height: 24px;}
.ls-pn-del span {font-size: 16px;line-height: 24px;padding:0 !important}
.ls-pn-del > span {padding:16px !important}
.ls-pn-del img {height:48px;max-height: none !important;margin-right:24px !important;}
.products-grid__filter--results { margin:24px 0;}
.product-listing-container-column {margin-top:0;padding-top:0;position: relative;}
#resultCount {border-bottom:0;top:-30px;right:0;position:absolute}
#resultCount.filter-added{top:-54px;}
.ls-pn-del {margin-top:0;}
.ls-pn-del{
display: flex;
}
.ls-pn-del.mobile{
display: none;
}
}
/*Responsive 1280*/
@media (min-width: 1280px) {
.product-page-grid {column-gap: 64px;grid-template-columns: calc(100% - 681px) 617px;}
.swiper-gallery-pagination-holder{ padding-top:24px;}
.grid-nav ul { border-bottom:1px solid #AEAEAE;column-gap:32px;}
.grid-nav ul li { border-bottom:0;flex-basis:25% !important;text-align:left;}
.grid-nav ul li a { margin-left:0;}
.grid-nav ul li:last-child { text-align: left;}
.grid-nav ul li span:first-child{ display: inline-block;}
.grid-nav ul li span:last-child{ display: none;}
.grid-376-1{ display: grid;grid-template-columns: 376px 1fr;grid-template-rows: 1fr;padding-bottom: 32px;margin-bottom: 32px;column-gap: 32px;}
.grid-376-1 > div:last-child { padding: 8% 32px 32px 0;}
.tab-co2 .grid-1-3.first > div { grid-template-columns: 1fr 3fr;}
.tab-co2 .tab-item-body .grid-1-3 > div h3 { grid-column: 1;margin-bottom:0 !important;}
.grid-1-3 > div{ grid-template-columns: repeat(4, minmax(0, 1fr));column-gap:32px;}
.grid-1-3 > div > *:first-child{ grid-column: 1/ span 1;}
/*.grid-1-3 > div > *:first-child{ grid-column: 1/ span 4;column-gap:24px;row-gap:32px;}*/
.grid-1-3 > div > *:last-child{ grid-column: 2/ span 3;}
/*.tab-installation .grid-pic > div div:last-child{ grid-column: unset;}*/
.grid-3-1 > div{ grid-template-columns: repeat(4, minmax(0, 1fr))}
.grid-3-1 > div > *:first-child{ grid-column: 1/ span 3;}
.grid-3-1 > div > *:last-child{ grid-column: 4/ span 1;}
/*.tab-product-grid{ grid-template-columns: repeat(4, minmax(0, 1fr));}*/
.tab-product-grid > *{ grid-column: 1 / span 1;}
.tab-product-grid > *:nth-child(2){ grid-column: 2 / span 3;}
.tab-inner .grid-1-3 .row.pad-top { padding-top:32px;border-top:1px solid #AEAEAE;border-top:0.5px solid #AEAEAE;}
.grid-1-3 > div .row{ padding-bottom: 32px;margin-bottom: 32px;}
.grid-1-3.first{ margin-bottom: 32px;}
/*.grid-1-3.trigreen > div{ grid-template-columns: 4fr 6fr;column-gap:12px;align-items: center}*/
.grid-1-3.trigreen > div{ grid-template-columns: 1fr;column-gap:0;row-gap:48px;align-items: center}
/*.trigreen .triangles-green{ margin-top:32px;flex-direction: column;flex-wrap: nowrap}*/
.tab-co2 picture { grid-column:1 / span 1 !important;width: calc(50% - 30px);margin-top:0;}
.trigreen .triangles-green{ margin-top:0;flex-direction: row;flex-wrap: wrap}
.tab-co2 .triangles-green li{flex-basis: calc(50% - 30px);}
.trigreen img{ width:100% !important;}
.flex-row.about{padding:0 24px 0 0;}
.img-comp-container {position: relative;height: 308px; /*should be the same height as the images*/width: 308px;margin:0;}
.img-comp-overlay{width:308px;height:308px;border-right:1px solid #fff;}
.img-comp-img{ margin: 0 auto}
.open .wet-dry-cont p.slide{ font-size:16px;margin-bottom:0 !important;}
.wet-dry-cont div .copy {padding: 0;}
.tab-wet-dry .grid-340-1 {grid-template-columns: 307px 1fr;}
.wet-dry-cont .bg-grey { padding:32px !important;}
.image-contactus{ background: url('https://d3przyomkgkv0c.cloudfront.net/fit-in/830x752/filters:format(.webp)/filters:quality(75)/mediadev/media/cms-pages/contact-us-bg-1280.png') no-repeat 100% 100%;background-size: contain;padding:0;}
.image-contactus h3 {margin-left:24px !important;}
.image-contactus p:first-child{ max-width:60%;margin-bottom:32px;}
.tab-item button.whatsapp:last-child{ margin-bottom: 32px;}
.image-contactus .grid-1-3{ padding-top: 64px;}
.swiper-colours .swiper-wrapper .swiper-slide {min-height: 380px;}
.swiper-colours .controls, .swiper-layingpatterns .controls, .swiper-extras .controls { margin-top:32px;}
.table-group-price tr { border-bottom:1px solid #D7D4D9;}
.table-group-price :nth-last-child(1 of :not(.hidden)) { border-bottom:0;}
.table-group-price tr td { border-bottom:0;}
.table-group-price tr td:first-child, .table-group-price tr th:first-child { padding-left:16px;}
.table-group-price tr td:last-child, .table-group-price tr th:last-child { padding-right:16px;}
.grid-also .tab-large{ margin:64px 0 0;padding:0;border-bottom:0;}
.grid-pic img{ min-height:104px;}
img.avatar { width:128px;height:128px;margin-right: 32px;text-align:right;}
.tab-description h2{ display: block;}
.tab-description .description-links { display:flex;margin-top:48px;flex-direction:row;justify-content: space-between;column-gap: 0;flex-wrap: wrap;}
.tab-description .description-links a { width: 50%;}
.tab-hd .grid-1-3 > div { display:unset;}
.grid-340-1{grid-template-columns: 340px 1fr;column-gap: 64px;}
.grid-340-1 > div:first-child{padding: 32px 0 32px 32px;}
.flex-row.about > div:first-child { flex:0 0 47%;}
.grid-tabs > .tab-item .tab-item-body h3 { }
.grid-pic > div div{ padding:32px 32px 32px 0;}
.tab-sealing .bg-grey > div, .tab-installation .bg-grey > div, .tab-cleaning .bg-grey > div, .tab-delivery .bg-grey > div { column-gap:32px;grid-template-columns: repeat(4, 1fr);}
.hastestimonial .ls-testimonial-text p { font-size: 32px;}
}
@media (min-width: 1600px){
.page-product-grouped #maincontent {margin: 0 auto;}
.grid-container, .grid-container-lg, .breadcrumbs-cont, .page-products .breadcrumbs { padding:0;}
.swiper-colours .swiper-slide p{ margin:54px 32px 32px !important;}
.swiper-colours .swiper-wrapper .swiper-slide {min-height: 490px;row-gap:3px;}
.tab-description .description-links { column-gap: 32px;justify-content: flex-start;margin-top:64px;}
.tab-description .description-links a { width: auto;}
.tab-hd .grid-1-3 > div { display:grid;column-gap:32px;}
.tab-wet-dry .copy p { max-width: 480px;}
.tab-co2 h3, .green-text.small {font-size: 24px !important;}
.flex-row.about .table-specification { margin-top:16px;margin-bottom:32px;}
.flex-row.about > div:first-child { flex:0 0 50%}
.tab-large, .tab-large.hastestimonial{ padding: 0;}
.tab-large.hastestimonial > *:first-child{ margin-left:auto;}
.grid-tabs .tab-item .faq-item-body { max-width:768px;}
.grid-tabs .faq-item.open, .grid-tabs .faq-item { margin:0 0 16px 0 !important;}
.grid-tabs .faq-item.open .faq-item-header{ margin-bottom:16px;}
.tab-hd p {font-size:12px;line-height:16px;}
.tab-colour .tab-inner > div > p { width:80%;}
.swiper-layingpatterns.pagination-outside {padding-bottom: 0;}
.swiper-layingpatterns .swiper-slide div:first-child { padding:0;margin-top:32px;}
.swiper-layingpatterns .swiper-slide div:last-child { margin:0;padding:32px 0;}
.tab-contact .gradient-green { height:361px;}
.tab-contact .gradient-green .image-contactus { height:100%;}
.image-contactus{ background: url('https://d3przyomkgkv0c.cloudfront.net/fit-in/448x448/filters:format(.webp)/filters:quality(75)/mediadev/media/cms-pages/faq_staff_desktop2x.png') no-repeat calc(100% - 48px) 100%;background-size: contain;padding:0;}
.tab-faqs .tab-item-body .faq-item { padding-bottom:32px !important;margin-bottom:32px !important;}
/*.tab-faqs .tab-item-body { padding-bottom:0 !important;}*/
.tab-item .faq-item:last-child{ margin-bottom:0 !important;}
.tab-co2 picture { grid-column:2 / span 1 !important;width: 100%;margin-top:0;}
.tab-co2 .grid-1-3.trigreen > div { grid-template-columns:1fr 443px ;column-gap:13px;}
.tab-co2 .triangles-green li { flex-basis: 100%;}
.grid-tabs .pic-bg { min-height: 136px;}
.zoom-icon span{ margin:0 32px 32px 32px;font-size:12px;}
.zoom-icon img {margin:0 32px 32px 0}
.swiper-button-next { right:32px;}
.swiper-button-prev { left:32px;}
.cheshire-hp.choose-cheshire {margin-left: calc(-50vw + 50%) !important;margin-right:calc(-50vw + 50%) !important;max-width: none !important;width: auto !important;}
.cheshire-hp.choose-cheshire .hp-paving-slabs-wrap {max-width:1600px;margin-left: auto;margin-right:auto;}
}
/*********************************************** End Product page ******************************************************/
/*********************************************** Marketing messages ******************************************************/
.ls-grid-mtag {color:#fff;padding:0 16px;font-size:12px;letter-spacing: 0.6px;height:25px;text-transform: uppercase;line-height: 25px;}
.ls-grid-mtag.cs-sale {background-color:#C5312D;color:#fff;}
.ls-grid-mtag.cs-clearance {background-color:#FFDD00;color:#000;}
.ls-grid-mtag.cs-instock {background-color:#268521;color:#fff;}
.ls-grid-mtag.cs-outofstock {background-color:#F7DBDB;color:#C5312D;}
.ls-grid-mtag.cs-comingsoon, .ls-grid-mtag.cs-bestselling { background-color:#1656AD;color:#fff;}
/*********************************************** Quantity Calculator ******************************************************/
.slideover {width:100vw;position: absolute;top:0;left: calc(100vw);z-index: 99999;background-color: #EBEAEC;transition:left 0.2s ease-in-out, width 0.2s ease-in-out;padding:0;margin:0;font-size: 12px;z-index:100;}
.slideover.open { left:0;overflow-y:auto;height:100vh;}
.slideover.designboard, .slideover.larsen-grout, .slideover.larsen-grout, .slideover.larsen-grout, .slideover.millboard {height:calc(100vh - 190px)}
.header-sticky .slideover.designboard, .header-sticky .slideover.larsen-grout, .header-sticky .slideover.millboard {height:calc(100vh - 150px)}
.slideover h2,.slideover h3 {margin: 0; font-family: var(--font-text-medium); font-size: 16px; letter-spacing: -0.08px}
.slideover #qc_intro { line-height: 20px;}
.slideover label {font-family: var(--font-text-medium);text-transform: lowercase}
.slideover label:first-letter {font-family: var(--font-text-medium);text-transform: uppercase}
.slideover label.mw48-dw38 { width:48%;}
.slideover label.w55 { width:55%;}
.slideover label.w40p { width:40px !important;;}
.slideover label.fb-auto { flex-basis: auto !important;width: auto !important;}
.qc-section {padding: 12px; border-bottom: 1px solid #E5E3E4;}
.qc-section h3 {margin-bottom: 8px;}
.qc-section p {margin: 0; font-size: 12px; letter-spacing: -0.06px}
/*.slideover.product_qc_open { visibility: visible;left: 0;width:100vw;overflow:hidden;margin:0 -24px 0 -24px;}*/
#product_qc_slideover { position: fixed; margin:0;top:202px;}
.header-sticky #product_qc_slideover { top:137px;}
.slideover .select-box #sort-disp { display: flex;align-items: center;}
.slideover-inner {color: #555;background-color: #FDFDFD;height: auto;margin:24px;}
.slideover .select-box.display-always { max-width: none;border:0;}
.slideover .selected::after {
background: url("/media/skin/icons/faq_icon.svg");background-size:10px 9px;height: 9px;width: 10px;right: 16px;top: 16px;transition: all 0.4s;display:inline-block;flex-shrink: 0;position: static;margin-left:auto;}
.slideover .select-box.display-always .selected { padding:0 15px 0 0;font-size:12px !important;background:transparent}
.slideover .select-box.display-always .selected span {font-family: var(--font-text-medium); }
.cont-close { margin:24px 24px 40px 24px;text-align:right;}
.close_product_qc { cursor:pointer;}
.close_product_qc.desktop { margin-left:auto;}
.qc-title { display:flex;column-gap:12px;padding:12px;border-bottom:1px solid #E5E3E4;}
.lsqp > .qc-section:first-child {margin-top: 0; padding-top: 16px}
.qc-section:last-child {border-bottom: none}
#close_product_qc {margin-left:auto;cursor:pointer}
.flex-g12{ display:flex;align-items:center;column-gap:12px;}
.slideover .select-box.display-always > .selected { border:1px solid #E59804;border:0.25px solid #BE8741;}
.slideover .select-box.display-always .option, .slideover .select-box.display-always .options-container ~ .selected { font-size: 12px; padding:0 6px;line-height: 32px;}
.slideover .select-box.display-always .options-container {box-shadow: none;border:1px solid #E59804;border:0.25px solid #BE8741;border-top-color:#fdfdfd;top:32px; }
.slideover .select-box.display-always .options-container ~ .selected {padding:0 12px 0 6px;color:#E59804 !important;}
#qp-result, #qp-result-tubs, .ls-qp-result { color:#E59804;font-family: var(--font-text-medium);margin-left:4px}
.qc-section.relative { position:relative;}
.qc-section.flex { display:flex;align-items: center;}
.qc-section.flex[style*='display: block']{display: flex !important;}
.gl {flex-grow:1;justify-items: flex-end;}
.slideover .select-box.display-always .selected span{ margin-right:4px;}
.qc-submit { border:1px solid #E59804;background-color:#FDFDFD;color:#555555;text-transform: none;padding:10px 16px;font-size: 12px;font-family: var(--font-text-regular);letter-spacing: -0.06px;height:40px;}
.qc-submit span::after { content: '';background: url(https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/chevron-orange-right.svg) no-repeat center center;display: inline-block;height: 11px;width: 10px;background-size: 10px 11px;margin: 0 0 0 8px;}
.qc-submit:hover span::after { background: url(https://d3przyomkgkv0c.cloudfront.net/mediadev/media/icons/chevron-white-right.svg) no-repeat center center;}
.qc-submit:hover { background-color: #E59803;color:#fdfdfd;border:1px solid #E59804;}
.qc-inputs-2up {display: flex;flex-direction: column;justify-content: flex-start;align-items: center;column-gap:16px;row-gap:8px;font-family: var(--font-text-medium);font-size: 12px;letter-spacing: -0.06px;}
.qc-inputs-2up.row1 { flex-direction: row;}
.qc-inputs-2up > div {display: flex; align-items: center; gap: 8px;flex-grow:0;/*width:100%;*/}
.qc-inputs-2up > div.w100 {width:100%;}
.qc-inputs-2up > div > *:first-child { width: 50%;}
.qc-inputs-2up.columns {flex-direction: column;gap:8px;}
.qc-inputs-2up.columns > div {width: 100%;}
.qc-inputs-2up.columns > div > *, .qc-inputs-2up > div > * {flex-grow: 0;justify-content: flex-end;}
.qc-inputs-2up.columns > div > *:first-child {justify-content: flex-start;flex-basis:50%;}
.qc-inputs-2up.columns > div.w46 > *:first-child {justify-content: flex-start;flex-basis:46%;}
.qc-inputs-2up.columns > div > *.wide {flex-basis:70%;}
.qc-inputs-2up.columns > div > .fbc {flex-basis: content;}
.qc-inputs-2up.columns > div > *:last-child, .qc-inputs-2up > div > *:last-child {flex-grow: 1;flex-shrink:0;}
.qc-inputs-2up > .grid { display: grid;grid-template-columns: repeat(2, 1fr);grid-template-rows: repeat(2, 1fr);grid-column-gap: 12px;grid-row-gap: 8px;}
.qc-inputs-2up > .grid > * { justify-content: flex-start !important;width:auto !important;}
.qc-inputs-2up > .grid > .row2 { grid-area: 2 / 2 / 3 / 3;}
.qc-inputs-2up > .grid > div label:first-child { min-width:51%;}
.qc-table { display:flex;flex-wrap:wrap;font-size: 10px;}
.qc-table > div { flex:1 100%;display: flex;padding:8px 12px;}
.qc-table > div:nth-child(odd) { background-color:#F9F8F8}
.qc-table label { width:50%; font-family: var(--font-text-regular);}
.qc-table.wide-label label { width:74%;}
.qc-table.wide-label label br { display:none}
.qc-table.wide-label label span { margin-left:8px;}
.lsqp label span { font-size: inherit;}
.wide-label .ls-qp-result { margin-left:auto;text-align: right;}
.qc-section input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="file"]) {border: 0.25px solid #BE8741;border-radius: 0;padding: 3px 0 3px 5px;height:29px;max-width: 68px;}
.qc-section input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="file"]):hover,
.qc-section input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="file"]):focus {border-color: #BE8741;}
.qc-section .regular { font-family: var(--font-text-regular);}
.qc-section .fs10 { font-size:10px;line-height:16px;}
.cont-hastooltip {position: relative;}
.hastooltip { cursor: pointer;display:block;width:16px;height:16px;}
.qc-desktop { display: none}
@media (min-width:496px) {
.slideover.open { left:calc(100vw - 496px);}
.slideover { width: 496px;}
.slideover label.w39, .slideover div.w39 { width:39%;}
.slideover label.w55 { width:auto;}
.slideover div.w38 { flex-basis:38%;width:auto;}
.slideover label.mw48-dw38 { width: 38%;}
.slideover label.desk-fb-auto { flex-basis: auto !important;width: auto !important;}
.slideover div.auto { flex-basis:auto;width:auto;}
.slideover-inner { width: 448px;margin:16px;border-top:0;}
.qc-inputs-2up.row1 { column-gap: 32px;}
.qc-title, .qc-section { padding:16px;}
.qc-inputs-2up {flex-direction: row;column-gap: 12px;}
.qc-inputs-2up > div { width: auto;flex-grow:0;}
.qc-inputs-2up > div > *:first-child { width: auto;}
.qc-inputs-2up.columns > div > *:first-child {flex-basis:47%;}
.qc-inputs-2up > .grid { grid-template-columns: 39% 1fr 1fr;grid-template-rows: none;grid-column-gap: 12px;}
.qc-inputs-2up > .grid > .row2 { grid-area:unset;}
.qc-inputs-2up > .grid > div { justify-content: space-between !important;}
.qc-inputs-2up > .grid > div.jc-fs{ justify-content: flex-start !important;}
.qc-table > div { flex:1 50%;justify-content: space-between;}
.qc-table > div:nth-child(odd) { padding:8px 8px 8px 16px;border-right:1px solid #E5E3E4;background-color: transparent;}
.qc-table > div:nth-child(even) { padding:8px 16px 8px 8px;background-color: transparent;}
.qc-table > div:nth-child(4n+1), .qc-table > div:nth-child(4n+2), .qc-table > div.grey-bg { background-color:#F9F8F8}
.qc-table > div.white-bg { background-color:transparent}
.qc-table label { width:auto;}
.qc-table.wide-label label br { display:block}
.qc-table.wide-label label span { margin-left:0;}
}
@media (min-width:550px) {
#product_qc_slideover { top:150px;}
.header-sticky #product_qc_slideover { top:68px;}
}
@media (min-width:768px) {
.slideover { height:100vh !important;}
#product_qc_slideover { top:206px;}
.header-sticky #product_qc_slideover { top:118px;}
.qc-desktop { display: block}
.qc-mobile { display: none;}
}
@media (min-width:1024px){
.slideover { left:504px;width:480px;height:auto !important;}
.slideover.open { left:0}
/*.slideover.product_qc_open { width: 480px;margin:0;position:absolute;}*/
#product_qc_slideover { position: absolute;top:0 !important;height:auto;}
.cont-close { display:none;}
/*.close_product_qc.desktop { display: block;margin-left:auto;}*/
}
@media (min-width:1280px){
.slideover { left:617px;}
/*.slideover.product_qc_open { width: 480px;}*/
.slideover-inner { width: 431px;margin:24px;}
.qc-section { padding:16px;}
}
@media (min-width:1600px){
.slideover { width:0;left:480px;overflow-x: hidden;}
.slideover.open { width:480px;}
}
.bubble
{
position: absolute;
width: 180px;
/*height: 120px;*/
padding: 0px;
background: #efe2d2;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
border: #e6bd7b solid 1px;
font-size:10px;
box-shadow: 0px 2px 7px 0px rgba(163, 163, 163, 0.29);
left:-87px;
bottom:29px;
z-index: 222;
padding:8px;
font-family: var(--font-text-medium);
opacity: 0;
visibility: hidden;
transition: opacity 0.4s ease-in-out;
}
.bubble.display{
opacity: 1;
visibility: visible;
}
.bubble:after
{
content: '';
position: absolute;
border-style: solid;
border-width:10px 10px 0;
border-color: #efe2d2 transparent;
display: block;
width: 0;
z-index: 1;
bottom: -10px;
left: calc(50% - 5px);
}
.bubble:before
{
content: '';
position: absolute;
border-style: solid;
border-width: 10px 10px 0;
border-color: #e6bd7b transparent;
display: block;
width: 0;
z-index: 0;
bottom: -11px;
left: calc(50% - 5px);
}
.span-flex{ display:flex;}
/*********************************************** plp ******************************************************/
@media (min-width: 1024px){
.category-page-title-container .intro > h1 {margin:12px 0 64px 0;}
}
/*********************************************** End Quantity Calculator ******************************************************/
.catalog-product-view .messages {display: none}
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon {width: 20px;height: 30px;background-position: left center;background-image: url(https://d3przyomkgkv0c.cloudfront.net/mediadev/media/home/shopping-bag-empty-1.svg);background-size: 17px 24px;}
.ls-basket-count {background-color: var(--color-cheshire);bottom: 16px;right: -7px;width: 16px;height: 16px;border-radius: 12px; font-size: 10px;display: flex;position: absolute;justify-content: center;align-items: center;line-height: 0;}
.table-group-price input[type="number"], .table-group-priceinput[type='number'], .table-group-price input[type=number] { webkit-appearance:textfield;appearance:textfield;-moz-appearance:textfield !important;}
/*************************************************** basket ***************************************/
/* buttons */
.button, .checkout-container button, .grid-form button {font-size: 16px;padding:0;font-weight: 600;font-family: var(--font-text-medium);border-radius:0;margin:0;border:1px solid #FDFDFD;border:1.5px solid #FDFDFD;display: flex;justify-content: center;align-items: center;letter-spacing: -0.4px;line-height:20px;text-transform: none;min-height:43px;}
.button.tertiary, .checkout-container button.tertiary { background-color:#FDFDFD;color:#D3AE6F;border-color: #FDFDFD; }
.button.tertiary:hover, .checkout-container button.tertiary:hover { background-color:#F9F5EF;color:#D3AE6F;border-color: #FDFDFD; }
.button.tertiary:focus, .button.tertiary:active, .checkout-container button.tertiary:focus, .checkout-container button.tertiary:active { background-color:#F2EBDF;color: #9A7B4C;border-color: #FDFDFD; }
.button.secondary, .checkout-container button.secondary {background-color:#FDFDFD;color:#D3AE6F;border-color: #D3AE6F;}
.button.secondary:hover, .checkout-container button.secondary:hover {background-color:#F9F5EF;color:#D3AE6F;border-color: #D3AE6F;}
.button.secondary:focus, .button.secondary:active, .checkout-container button.secondary:focus, .checkout-container button.secondary:active {background-color:#F2EBDF;color:#9A7B4C;border-color: #9A7B4C;}
.button.primary, .checkout-container button.primary, .grid-form button.primary {background-color:#D3AE6F;color:#FDFDFD;border-color: #D3AE6F;}
.button.primary:hover, .checkout-container button.primary:hover, .grid-form button.primary:hover, div.login-popup #ls-login-submit:hover, .boxLink:hover + div .button.primary {background-color:#D9C29F;color:#FDFDFD;border-color: #D9C29F;}
.button.primary:focus, .button.primary:active, .checkout-container button.primary:focus, .checkout-container button.primary:active, .grid-form button.primary:focus, .grid-form button.primary:active, div.login-popup #ls-login-submit:focus, div.login-popup #ls-login-submit:active, .boxLink:focus+div .button.primary, .boxLink:active+div .button.primary {background-color:#9A7B4C;color:#FDFDFD;border-color: #9A7B4C;}
button[data-action="checkout-method-login"], .form-discount button {font-size: 16px;margin:0;margin-bottom:12px;font-weight: 600;font-family: var(--font-text-medium);border-radius:0;border:1px solid #FDFDFD;border:1.5px solid #FDFDFD;display: flex;justify-content: center;align-items: center;letter-spacing: -0.4px;line-height:20px;text-transform: none;min-height:43px;width: 100%;}
button[data-action="checkout-method-login"], .form-discount button {background-color:#D3AE6F;color:#FDFDFD;border-color: #D3AE6F;}
button[data-action="checkout-method-login"]:hover, .form-discount button:hover {background-color:#D9C29F;color:#FDFDFD;border-color: #D9C29F;}
button[data-action="checkout-method-login"]:focus, button[data-action="checkout-method-login"]:active, .form-discount button:focus, .form-discount button:active {background-color:#9A7B4C;color:#FDFDFD;border-color: #9A7B4C;}
.form-discount button { min-height: auto;height:32px;min-width: 80px !important;}
.form-discount button span span{
font-size: 0;
}
.form-discount button span span::after{
content: 'Apply';
font-size: 16px;
display: inline-flex;
margin-top: 5px;
}
@media (min-width: 1024px) {
button[data-action="checkout-method-login"] {width: 101px !important;}
.form-discount button span span {
font-size: 16px;
}
.form-discount button span span::after {
display: none;
}
}
/* */
.checkout-cart-index #maincontent { margin:0 24px;padding:0;}
.grid-100, .grid-30, .grid-33, .grid-50, .grid-66, .grid-70, .grid-75{ padding:0;}
h1.page-title{ font-size:clamp(32px,3.5vw,40px);font-weight:600;text-align:left;letter-spacing: 0;line-height: 36px;color:#000;leading-trim: both;text-edge: cap;margin-top:20px;padding-bottom:0;}
.page-title .base{ color:#000;}
.page-title-wrapper.lsobm-header{ padding:0;margin-bottom:24px;}
#opc-m2msg {font-size:20px;font-weight:500;line-height:24px;letter-spacing: -0.05px;color:#000;margin:0 0 48px 0;}
.lsobm-checkout-types { margin:0;row-gap:12px;}
.lsobm-checkout-types > li:first-child .cart-round-button__hollow{border:0;}
.lsobm-checkout-types > li:first-child .cart-round-button__hollowhover {background-color:#F9F5EF;color:#D3AE6F;}
.lsobm-checkout-types {margin-bottom:60px;}
.cart-container, .totals-table, .ls-opc-rhs-help { font-size:12px !important;}
.cart-header #ls-product-quantity-select { transform: none;}
.cart-header > label { margin:0 0 8px;}
.cart-header .switch--horizontal {width:auto;}
.cart-header .switch--horizontal label { /*font-size:12px !important;*/opacity: 1 !important;color:#4E5252;width:auto;text-transform: lowercase}
.cart-header .switch--horizontal label[for="radio-a"] { padding-right:8px;}
.cart-header .switch--horizontal label[for="radio-b"] { padding-left:8px;}
.modal-scroll .cart-header .switch--horizontal input:checked~.toggle-outside{background-color: #CAD1D3}
.modal-scroll .cart-header .switch--horizontal input~input:checked~.toggle-outside{background-color: #D3AE6F;}
.modal-scroll .cart-header .switch--horizontal label {font-size: 0 !important;}
.cart-header .switch--horizontal .toggle-outside {background-color:#D3AE6F;left:26px;}
.cart-header .switch--horizontal label:last-of-type { margin-left:35px;}
.cart.table-wrapper {color:#4E5252;display: inline-block;width:100%;}
.cart-header{ border-bottom:1px solid #D1D6DA !important;}
.cart-header, .cart-item { grid-template-columns: 43fr 18fr 17fr 22fr;column-gap: 8px;}
.cart-item { border-bottom:1px solid #D1D6DA;font-size: inherit}
.cart-item-details img{ max-width:34px;max-height:34px;}
.cart-item input[type="number"] { border-radius: 0;border:1px solid #D1D6DA !important;padding:2px;font-size: inherit;font-family: var(--font-text-regular)}
.cart-item-details a:first-child {margin-right: 0}
.cart-item-details a:first-child img {display: none}
.cart-item > div { padding:12px 0 24px 0;}
.cart-item .cart-item-quantity {padding:8px 0 24px 0}
.cart-item .btn-remove { background-image:url('data:image/svg+xml,');text-indent: -50000px;width:11px;height:13px;display: block;margin-top:16px;}
.cart-item .btn-remove span {display: none}
.cart-container { margin-top:60px;}
.cart-container .totals {display: inline-block;margin-top:48px;width:100%;}
.cart-container .totals h2, .block.discount h2 {font-weight:600;letter-spacing: -0.5px;padding-bottom:24px;margin-bottom: 0;font-size:20px;color:#000;}
.cart-item-price, .cart-item-quantity {text-align: left;}
.lsobm-totals {margin:0;}
.lsobm-totals h2 { margin-top:0;color:#000;}
.lsobm-totals td { font-size:inherit;}
.lsobm-totals table, .lsobm-totals tbody tr:first-child td { padding-top:12px;}
.lsobm-totals table, .lsobm-totals tbody tr:last-child td { padding-bottom:12px;}
.lsobm-totals table, .lsobm-totals tbody tr td:first-child { color:#4E5252 !important;;letter-spacing: -0.3px;}
.lsobm-totals tfoot td { font-size: inherit}
.lsobm-totals tfoot td strong {font-weight: 600 !important;padding-bottom:24px;margin-bottom: 0;font-size:20px;color:#000;}
.cart.main.actions {display: none;}
.lsobm-checkout-types {margin:48px 0 0 0;}
.lsobm-checkout-types .button {width: 100%;}
.discount {margin:48px 0;}
.discount h2 { border-bottom:0;}
.discount .input-box {margin:0;}
.discount .button {font-size:12px;padding:0 16px;height:32px;min-height:32px;width:auto;min-width:69px}
.discount input[type="text"] {border: 1px solid #D3AE6F !important;background: #FFF;height:32px;font-size:12px;padding:12px;font-family:var(--font-text-regular);border-radius:0;}
.ls-opc-rhs-help {background-color: #EDF0F0;margin:48px 0;;line-height:16px;color:#4E5252;font-weight:500;letter-spacing: -0.3px;}
.ls-opc-rhs-help h2 {font-size:inherit;line-height:inherit;color:#000;font-family: var(--font-text-medium);letter-spacing: -0.3px;font-weight:500;}
.ls-opc-rhs-help p {max-width:295px;}
.ls-opc-rhs-help p, .ls-opc-rhs-help a {letter-spacing:inherit;font-size:inherit;font-weight:400;color:#4E5252;font-family: var(--font-text-regular);}
.ls-opc-rhs-help li {margin-top:24px;}
.ls-opc-rhs-help li:first-child {margin-top:0;}
.ls-opc-rhs-help li img, .ls-opc-rhs-help li:first-child img { max-width: 24px;}
.ls-opc-rhs-help div, .ls-opc-rhs-help li:first-child div {margin-top: 0;padding-right:24px;padding-left:25px;}
.cart-recommend {margin-bottom:48px;}
.cart-recommend .tab-large.faux {margin:48px 0 0;padding:0;}
.cart-recommend h2, .cart-recommend .product-carousel__text a{ color:#000;font-family: var(--font-text-medium);font-size:20px;font-weight:600;line-height: 28px;letter-spacing: -0.5px;margin-bottom:20px;}
.cart-recommend .product-carousel__text {margin-top:24px;}
.cart-recommend .product-carousel__text a {margin-bottom:0;line-height:24px;}
.cart-recommend .ls-grid-price-wrapper .ls-grid-price { margin:16px 0 24px 0 !important;}
.cart-recommend .button {padding:0 32px;width:fit-content;}
.ls-opc-rhs-help { padding:24px;margin:48px 0 0;}
/*.cart-header .switch--horizontal .toggle-outside {width:48px;height:24px;}*/
/*.switch--horizontal .toggle-inside {width:22px;height:22px;}*/
/*.switch--horizontal input ~ input:checked ~ .toggle-outside .toggle-inside {left:20px;} !* width of left label + padding right *!*/
.cart-item a {color:#4E5252}
@media (min-width: 400px) {
.cart-item input[type="number"] {padding: 4px 2px 4px 8px;}
}
@media (min-width: 600px) {
.cart-header > label {border-bottom:0;font-size:1em;}
.cart-item-details a:first-child img {display: inline-block;margin-right: 12px;}
.lsobm-checkout-types {column-gap: 24px;justify-content: flex-start;}
.lsobm-checkout-types li {margin:0;width:33.33%;max-width: 228px}
.lsobm-checkout-types li button {height: 100%;width: 100%;max-width:228px;}
}
@media (min-width: 768px) {
.cart-item-details img{ max-width:64px;max-height:64px;display:inline-block;margin-right: 12px;}
.cart-container, .totals-table, .ls-opc-rhs-help { font-size:16px !important;}
.ls-opc-rhs-help {line-height: 24px;}
.discount .button { font-size: 16px;padding:16px 32px;height:32px;min-width:92px;}
.discount input[type="text"] { padding:12px;height:35px;}
.cart-header .switch--horizontal .toggle-outside { left:32px;}
.cart-header .switch--horizontal label:last-of-type {margin-left: 32px;}
}
@media (min-width: 1024px) {
.lsobm-checkout-types {column-gap: 32px;margin-bottom:64px;}
.lsobm-totals tfoot td {font-size:20px;}
.cart-header .switch--horizontal label:last-of-type {margin-left: 44px;}
.ls-opc-rhs-help { grid-area:top}
.discount { grid-area:bottom}
.grid-coupon-usp { display: grid;
grid-template-areas:
'top'
'bottom';}
.discount {margin-top:64px;}
.discount h2 {font-size:16px;padding-bottom:32px;}
.cart-container .totals h2 {padding-bottom:48px;}
.cart-recommend {margin-bottom:48px;}
.cart-recommend .controls {margin-top:32px;}
.cart-recommend .tab-large.faux {margin:0;padding:0;border-bottom:0;}
.cart-container .totals h2 { font-size: 28px;}
.cart-container .totals {margin-top:64px;}
.cart-recommend h2, .cart-recommend .product-carousel__text a{ font-size:28px;line-height: 32px;letter-spacing: -0.7px;}
.cart-recommend h2 {margin-bottom:48px;}
.cart-recommend .product-carousel__text {margin-top:32px;}
.cart-recommend .product-carousel__text a {line-height:32px;margin-bottom:0;}
.product-carousel__text + .ls-grid-price-wrapper .ls-grid-price { margin:16px 0 32px 0 !important;font-size:20px !important;}
.ls-grid-price-wrapper .ls-grid-price { margin:0 !important;font-size:20px !important;letter-spacing: 0;font-weight:400;}
.cart-item .btn-remove { margin-top:8px;display: inline-block;width:auto;height:16px;background-size: 15px 16px;background-repeat:no-repeat;text-indent: 0;}
.cart-item .btn-remove span { display: inline-block;padding-left:20px;font-size:12px;}
.page-title-wrapper.lsobm-header{ margin-bottom:48px;}
#opc-m2msg {margin:0 0 64px 0;}
.ls-opc-rhs-help {padding:32px;}
.ls-opc-rhs-help p { max-width:none}
.cart-item > div { padding:24px 0;}
.cart-item > .cart-item-quantity { padding:20px 0;}
.lsobm-totals table, .lsobm-totals tbody tr:first-child td {padding-top: 24px;}
.lsobm-totals table, .lsobm-totals tbody tr:last-child td { padding-bottom: 24px;}
.lsobm-totals tfoot td {padding-top:24px;padding-bottom: 24px;}
.cart-recommend .controls { display:none;}
}
@media (min-width: 1280px) {
.cart-item-details a:first-child img { min-width: 104px;min-height: 104px;}
.ls-opc-rhs-help li img { max-width:none !important;width:14%;height: 37px;max-width:45px;}
.ls-opc-rhs-help div, .ls-opc-rhs-help li:first-child div {padding-right:0;padding-left:25px;}
}
@media (min-width: 1600px) {
.checkout-cart-index #maincontent { margin: 0 auto;}
.cart-header .cart-item-price, .cart-header .cart-item-quantity { padding-left:0;}
.cart-item-quantity input[type="number"] { max-width:103px;}
.basket1 .slider-crosssell .controls {display:none;}
.ls-opc-rhs-help { margin-top:192px;}
.block.discount h2 {padding-bottom:32px;}
.checkout-cart-index h1.page-title { font-size: 40px;}
}
/*************************************************** radio - checkbox ***************************************/
/*https://www.w3schools.com/howto/howto_css_custom_checkbox.asp*/
.container-input-rc {display: block;position: relative;padding-left: 40px;margin:16px 0 0;cursor: pointer;font-size: 12px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;min-width: 71px !important;text-align: left !important;}
.container-input-rc input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;}
.checkmark {position: absolute;top: 0;left: 0;height: 24px;width: 24px;background-image:url('data:image/svg+xml,');}
.container-input-rc:hover input ~ .checkmark {background-image:url('data:image/svg+xml,');}
.container-input-rc input:checked ~ .checkmark {background-image:url('data:image/svg+xml,');}
.checkmark:after {content: "";position: absolute;display: none;}
.container-input-rc input:checked ~ .checkmark:after {display: block;}
.container-input-rc .checkmark:after {background-image:url('data:image/svg+xml,');}
.radiomark {position: absolute;top: 0;left: 0;height: 25px;width: 24px;margin-bottom:12px !important;background-image:url('data:image/svg+xml,');}
.container-input-rc:hover input ~ .radiomark {background-image:url('data:image/svg+xml,');background-size: contain;background-repeat: no-repeat;}
.container-input-rc input:checked ~ .radiomark {background-image:url('data:image/svg+xml,');background-size: contain;background-repeat: no-repeat;}
.radiomark:after {content: "";position: absolute;display: none;}
.container-input-rc input:checked ~ .radiomark:after {display: block;}
.container-input-rc .radiomark:after {background-image:url('data:image/svg+xml,');background-size: contain;background-repeat: no-repeat;}
@media (min-width: 768px) {
.container-input-rc {padding-left: 44px;font-size: 16px;min-width: 71px !important;}
}
@media (min-width: 768px) {
.container-input-rc {margin:0 0 16px;}
}
/* New Footer Design */
footer {
padding: 24px;
padding-bottom: 32px;
background: #E3E6E9;
}
.footer__cols {
display: flex;
justify-content: space-between;
}
.footer__cols .mc-field-group {
justify-content: flex-start;
align-items: flex-start;
}
.footer__cols:not(.second) {
flex-direction: column;
}
.footer__cols .footer-logo {
display: grid;
text-align: left;
align-items: start;
grid-template-columns: auto;
}
.footer__cols.second {
align-items: center;
margin-top: clamp(40px, 4vw, 64px);
gap: 24px;
}
.footer__cols h2,
.footer__cols .footer-title,
.footer__cols .footer-title-nb,
.footer__cols h3 {
color: #000;
font-size: clamp(12px, 1.2vw, 16px);
line-height: 20px;
font-weight: 500;
letter-spacing: -0.3px;
}
.footer__cols h2,
.footer__cols .footer-title,
.footer__cols .footer-title-nb {
border-bottom: 1px solid #C4CCCE;
padding-bottom: 20px;
margin-bottom: 20px;
font-weight: 600;
}
.footer__cols .footer-title-nb {
border-bottom: 0;
}
/* 06.10.2025 changes according to SEO company */
.footer__cols .footer-title {
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
}
.footer__cols .footer-title::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 .footer-title.footer__cols-head--open:after {
transform: rotate(270deg);
}
@media (min-width: 1280px) {
.footer__cols .footer-title {
justify-content: flex-start;
}
.footer__cols .footer-title::after {
content: '';
display: none;
}
.footer__cols .footer-title-nb {
border-bottom: 0;
margin-top: 0;
}
}
.footer__cols .footer-title::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 .footer-title.footer__cols-head--open::after { transform: rotate(180deg); }
.footer__cols .footer-title-nb::after { display:none; }
/* end 06.10.2025 changes according to SEO company */
.footer__cols .footer-logo {
padding-bottom: 24px;
margin-bottom: 20px;
border-bottom: 1px solid #C4CCCE;
}
.footer__cols-group ul li {
margin-bottom: 6px;
}
.footer__cols li,
.footer__cols a {
color: #000 !important;
font-size: 12px !important;
line-height: 16px !important;
font-weight: 500 !important;
letter-spacing: -0.3px !important;
}
.footer__cols a.footer-sale {
color: #E91D25 !important;
letter-spacing: 0.7px !important;
}
.footer__cols h2.nb,
.footer__cols .footer-title-nb {
margin-top: 0;
padding-bottom: 0;
margin-bottom: 20px;
}
.footer__cols .newsletter_wrap {
width: 100%;
max-width: 100%;
}
.footer__cols .social-wrapper {
display: flex;
gap: 7px;
align-items: center;
}
.footer__cols .social-wrapper img {
height: 20px;
width: 20px;
}
.footer__cols #mce-EMAIL {
height: 32px;
padding: 12px;
width: 100%;
border: 1px solid #D3AE6F;
border-radius: 0px;
background-color: #fff;
}
.footer__cols #mce-EMAIL::placeholder {
color: #C4CCCE;
}
.footer__cols #mc-embedded-subscribe {
height: 32px;
min-height: 32px;
background: none;
background-color: #D3AE6F;
padding: 0 14.5px;
font-size: clamp(12px, 1.2vw, 16px);
line-height: 20px;
font-weight: 500;
letter-spacing: -0.3px;
}
.footer__cols .address-wrapper a {
cursor: pointer;
}
.footer__cols .address-wrapper{
margin-top: 24px;
}
.footer__cols .address-wrapper h3,
.footer__cols .address-wrapper .showroom-address {
font-size: 12px !important;
font-weight: 600 !important;
line-height: 20px !important;
}
.footer__cols .address-wrapper p{
font-size: 12px !important;
font-weight: 400 !important;
line-height: 20px !important;
}
@media(min-width:768px) {
.grid-container, .grid-container-lg{
padding-left: 0;
padding-right: 0;
}
.ls-footer__payments ul li img{
height: 12px;
}
.footer__cols .address-wrapper {
margin-top: 32px;
}
}
@media(min-width:1024px) {
.ls-footer__payments ul li img {
height: 20px;
}
}
@media(min-width:1280px) {
footer {
padding-top: clamp(24px, 4vw, 64px);
}
.footer__cols .footer-logo {
padding: 0;
margin: 0;
border-bottom: none;
min-width: 373px;
}
.footer__cols:not(.second) {
flex-direction: row;
}
.footer-columns>div:last-child {
justify-content: flex-start;
}
.footer__cols h2,
.footer__cols .footer-title,
.footer__cols .footer-title-nb {
font-weight: 600;
letter-spacing: -0.4px;
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
.footer__cols h2.nb,
.footer__cols .footer-title-nb {
margin-top: 0;
margin-bottom: 32px;
}
#mc_embed_signup {
margin-bottom: 0;
}
.footer__cols .footer__cols-group,
.footer__cols .ls-footer__payments {
margin-top: 32px;
margin-bottom: 0;
}
.footer__cols .footer__cols-group ul li:not(:last-child) {
margin-bottom: 10px;
}
.footer__cols .footer__cols-group ul li:last-child {
margin-bottom: 0;
}
.footer__cols #mc-embedded-subscribe {
letter-spacing: -0.4px;
}
.footer-columns .social-wrapper {
width: 512px;
}
.footer__cols .address-wrapper {
align-self: end;
max-width: 163px;
}
}
@media(min-width:1380px) {
.footer__cols .newsletter_wrap {
width: 512px;
}
}
/* New Footer Design */
/* New Header Design */
.header-container .block-search .block-content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
}
.header-container .block-search .block-content .minisearch {
width: 100%;
}
.header-container .hc-logo-container {
margin: 24px;
}
.page-header .hca-top-links ul {
column-gap: 12px;
}
.logo img.max {
max-width: 140px;
width: 140px;
min-height: 30px;
height: 32px;
max-height: 32px;
display: block;
}
.header-container .block-search .block-content .cheshire-call {
display: flex;
justify-content: center;
align-items: center;
gap: 16px;
position: absolute;
top: -53px;
right: 115px;
}
.header-container .block-search .block-content .cheshire-call a {
display: flex;
justify-content: center;
align-items: center;
gap: 16px;
}
.header-container .block-search .block-content .cheshire-call .call-img {
height: 20px;
width: 21px;
}
.header-container .block-search .block-content .cheshire-call .call-txt {
margin-bottom: 0;
display: none;
color: #000;
font-size: 24px;
line-height: 32px;
letter-spacing: -0.6px;
font-weight: 600;
}
.header-container .hc-actions-container .minicart-wrapper {
display: flex;
justify-content: center;
align-items: center;
}
.header-container .hc-actions-container {
flex-direction: row-reverse;
justify-content: flex-start;
}
.header-container .hca-aa-icons a[title="My Account"] {
background: none;
background-image: url(https://d1ctifminpgohi.cloudfront.net/Homepage/user_svg.svg);
background-size: 20px 20px;
background-repeat: no-repeat;
height: 20px;
width: 20px;
flex-basis: 20px;
border-right: none;
}
.header-container .hca-aa-icons a[title="My Account"].my-account-loggedin {
background-image: url(https://d1ctifminpgohi.cloudfront.net/icons/icon-logged-in.svg);
}
.header-container .hca-aa-icons a[title="My Account"].my-account-loggedin::after {
display: none;
}
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon {
width: 20px;
height: 18px;
background: none;
}
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon .counter.qty,
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon .counter.qty.ls-empty {
display: block;
background-image: url('https://d1ctifminpgohi.cloudfront.net/Homepage/basket_svg.svg');
background-size: 20px 18px;
width: 20px;
height: 18px;
}
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon .counter.qty {
background-image: url('https://d1ctifminpgohi.cloudfront.net/icons/Basket-Gold.png');
}
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon .counter.qty .ls-basket-count {
background-color: transparent;
bottom: auto;
right: auto;
top: 65%;
left: 50%;
transform: translate(-50%, -50%);
width: 16px;
height: 16px;
border-radius: 12px;
font-size: 10px;
font-weight: 600;
display: flex;
position: absolute;
justify-content: center;
align-items: center;
line-height: 0;
}
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon .counter.qty.ls-empty .ls-basket-count {
display: none;
}
.grid-container:has(.ls-redesign),
.grid-container-lg:has(.ls-redesign) {
padding-bottom: 20px;
}
.page-header .hca-top-links {
background-color: #E3E6E9;
}
.control #search {
border: 1px solid #D3AE6F;
background: #fff;
padding: 2px 12px;
height: 32px;
width: 512px;
max-width: 100%;
}
.header-container .block-search .block-content .minisearch .actions {
right: 0;
left: auto;
width: 32px;
background: #D3AE6F url('https://d1ctifminpgohi.cloudfront.net/Homepage/header_search.svg') no-repeat 5px center;
background-size: 24px;
}
.page-header .hca-top-links ul li a {
font-weight: 500;
line-height: 20px;
letter-spacing: -0.3px !important;
}
header .nav-sections {
background-color:#F6F7F8;
width: 100%;
max-width: 100%;
}
#main_navigation {
gap: 0;
}
#main_navigation>li {
min-width: auto !important;
background: transparent !important;
}
.menu-layout-1 .menu-expand .menu-pic {
display: flex;
gap: 24px;
border-bottom: 3px solid #EDF0F0;
padding-bottom: 40px;
margin-top: 0 !important;
margin-bottom: 40px !important;
}
.menu-layout-1 .menu-expand:last-child .menu-pic {
border-bottom: none;
padding-bottom: 0 !important;
}
.menu-layout-1 li.menu-expand:first-child .expand-level li.full {
margin-top: 24px;
}
.usp-cont {
background-color: #D1D6DA;
height: 48px;
top: 167px;
}
.usp-cont ul {
background-color: #D1D6DA;
gap: 48px !important;
justify-content: center;
}
.usp-cont ul li,
.usp-cont ul li.active,
.usp-cont ul li:nth-child(2) {
border-right: none;
padding-right: 0;
}
.usp-cont ul li:nth-child(2) {
margin-right: 0;
}
.usp-cont ul li span,
.usp-cont ul li a {
display: flex;
justify-content: center;
align-items: center;
color: #000;
font-size: 12px;
line-height: 8px;
font-weight: 400;
letter-spacing: -0.3px;
}
.usp-cont ul li span img,
.usp-cont ul li a img {
padding-right: 16px;
}
.usp-cont ul li span strong {
font-weight: 600 !important;
margin-right: 3px;
}
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');
background-repeat: no-repeat;
width: 16px;
height: 13px;
background-size: 16px 13px;
transform: translateY(15px) rotate(0deg);
position: absolute;
top: 5px;
right: 24px;
z-index: 2;
}
#main_navigation>li>a {
display: flex;
justify-content: flex-start;
align-items: center;
min-width: auto;
padding: 24px;
height: 11px;
font-size: 16px;
line-height: 20px;
font-weight: 500;
color: #000;
}
#main_navigation>li.main-menupoint.is-open>a {
background: #FDFDFD;
color: #000;
font-weight: 500;
border-color: #C09A5F;
}
#main_navigation #menu_sale a {
color: #E91D25;
font-weight: 600;
}
ul.menu-pic li.full,
ul.menu-pic-2 li.full,
.menu-pic-3 li.full,
#main_navigation .menu-expand.expand-level.d-col li.full a {
font-size: 20px !important;
line-height: 24px;
color: #000;
font-weight: 600;
}
li.menu-expand .expand-level a span {
font-size: 16px;
line-height: 20px;
font-weight: 500;
letter-spacing: -0.4px;
color: #4E5252;
transition: color 0.3s ease-in-out;
}
@media(max-width: 1279px){
li.menu-expand .expand-level a span {
max-width: 160px;
}
}
li.menu-expand .expand-level li:hover a span {
color: #000;
}
li.menu-expand .expand-level a:hover {
text-decoration: none;
}
li.menu-expand .expand-level .menu-img {
background-color: #D9D9D9;
height: 96px;
min-width: 144px;
width: 144px;
display: flex;
justify-content: center;
align-items: center;
}
li.menu-expand .expand-level .menu-img img {
width: auto;
height: 70px;
}
.main-menupoint.is-open>ul {
display: flex;
flex-direction: column;
padding: 0 24px;
}
li.menu-expand.paving-first .expand-level .mega-menu-link {
position: relative;
padding: 0;
}
li.menu-expand.paving-first .expand-level .mega-menu-link picture {
margin-top: 0;
}
li.menu-expand.paving-first .expand-level .mega-menu-link:hover {
text-decoration: none;
}
li.menu-expand.paving-first .expand-level .mega-menu-link img {
transition: all 0.3s ease-in-out;
}
li.menu-expand.paving-first .expand-level li:not(.full) .mega-menu-link img{
border-bottom: 4px solid #fff;
}
li.menu-expand.paving-first .expand-level li:not(.full):hover .mega-menu-link img {
border-bottom: 4px solid #C09A5F;
}
li.menu-expand.paving-first .expand-level .mega-menu-link .hover-mask {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 3;
background: rgba(255, 255, 255, 0.75);
display: none;
}
li.menu-expand.paving-first .expand-level:hover li:not(.full) .mega-menu-link .hover-mask {
display: block;
}
li.menu-expand.paving-first .expand-level li:not(.full):hover .mega-menu-link .hover-mask {
display: none;
}
.header-container.menu-open .block-search .block-content .minisearch {
position: absolute;
top: -90px;
left: 0;
width: calc(100% - 50px);
}
.header-container.menu-open .block-search .cheshire-call {
display: none;
}
ul.menu-layout-1>li.menu-expand:first-child {
border-right: none;
}
div.login-popup input.input-text[type='password'], div.login-popup input.input-text[type='email'] { font-size: 16px;}
/* Account Order Details */
.account .order-history-title h1 {
font-size: 32px;
line-height: 23px;
padding-bottom: 48px;
margin-top: 48px;
margin-bottom: 24px;
border-bottom: 1px solid #D1D6DA;
color: var(--color-black);
letter-spacing: 0.3px;
font-weight: 600;
}
.account .order-history-title button.cart-round-button__hollow{
max-width: 148px;
height: 44px;
}
.account button.cart-round-button__hollow {
margin-bottom: 0 !important;
background: transparent;
border: 1.5px solid #D3AE6F;
color: #D3AE6F;
max-width: 100%;
width: 100%;
}
.account button.cart-round-button__hollow:hover {
color: #DCBE8C;
border: 1.5px solid #DCBE8C;
background: #FBF7F1;
}
.account button.cart-round-button__hollow:focus,
.account button.cart-round-button__hollow:active {
color: #947A4E;
border: 1.5px solid #947A4E;
background: #F6EFE2;
}
.account .order-history-title h1 .order-number {
font-size: 16px;
line-height: 24px;
font-weight: 400;
color: var(--color-emperor);
display: block;
margin: 12px 0 2px;
}
.account .order-history-title h1 .order-status {
font-size: 20px;
line-height: 16px;
color: #D3AE6F;
}
.account .order-history-info,
.account .order-info-col,
.account .order-info-col dl{
margin-bottom: 0;
}
.account .order-history-title h2,
.account .order-info-boxes h2{
color: var(--color-black);
font-size: 16px;
line-height: 12px;
font-weight: 600 !important;
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none;
letter-spacing: 0.1px;
border-bottom: 1px solid #D1D6DA;
margin-bottom: 24px;
padding-bottom: 24px;
margin-top: 48px;
}
.account .order-history-info,
.account .order-info-col dl dd,
.account .order-info-col dl dd address,
.account .order-info-col dl dd address a{
font-size: 12px;
line-height: 20px;
font-weight: 400;
color: var(--color-emperor);
}
.account .order-details-items.order-history-page h2,
.account .extra-information-container h2 {
font-size: 20px;
line-height: 28px;
font-weight: 600;
letter-spacing: 0.3px;
padding-bottom: 24px;
margin-bottom: 24px;
margin-top: 48px;
color: var(--color-black);
border-bottom: 1px solid #D1D6DA;
}
.account .order-details-items.order-history-page h2{
margin-bottom: 12px;
}
.account .cart-item~.pagination-container,
.account #order_view_pagination_top,
.account .cart-item-details img{
display: none;
}
.account .items-ordered-container .cart-item>div,
.account .cart-header>label{
color: var(--color-emperor);
font-size: 12px;
line-height: 9px;
font-weight: 400;
}
.account .items-ordered-container .cart-item>div{
padding: 12px 0 24px 0;
}
.account .items-ordered-container .cart-item>.cart-item-details{
line-height: 20px;
}
.account .order-extras li span{
font-size: 12px;
line-height: 20px;
color: var(--color-emperor);
margin-bottom: 24px;
font-weight: 400;
}
.account .order-extras li:last-child span:first-child{
color: var(--color-black);
}
.account .order-extras li:last-child span:last-child {
margin-bottom: 0;
}
.account .order-extras li span:last-child{
font-weight: 600;
}
.account .order-details-items.order-history-page{
margin-top: 0;
}
.account .order-extras li{
flex-direction: column;
}
.account .totals{
margin: 24px 0;
column-gap: 0;
row-gap: 12px;
font-size: 12px;
font-weight: 400;
color: var(--color-emperor);
}
.account .totals strong{
margin: 0;
padding: 12px 0;
font-weight: 500 !important;
font-size: 12px;
color: var(--color-black);
border-top: 1px solid #D1D6DA;
border-bottom: 1px solid #D1D6DA;
}
.account .order-history-page-buttons{
margin: 48px 0;
}
/* Account Order Details */
@media(min-width:550px) {
.header-container {
height: 167px;
}
.header-container .block-search {
align-self: self-start;
grid-area: 3 / 1 / 4 / 5;
}
.control #search {
max-width: 100%;
width: 100%;
}
}
@media(min-width:768px) {
.header-container {
height: 122px;
}
.header-container .block-search {
align-self: center;
grid-area: 2 / 2 / 3 / 3;
}
ul.menu-pic li {
flex-basis: calc(15% - 20px);
}
.header-container .block-search .block-content {
flex-direction: row;
}
ul.menu-layout-1>li.menu-expand:first-child {
margin: 0;
}
.header-container .block-search .block-content .cheshire-call {
top: 6px;
right: -60px;
}
.page-header .hca-top-links ul {
margin-right: 24px;
}
.main-menupoint>a:hover,
.main-menupoint.is-open>a {
border-color: #C09A5F;
}
ul.menu-layout-1::before {
display: none;
}
.main-menupoint.is-open>ul {
row-gap: 0;
margin-top: -1px;
flex-direction: column;
}
.header-container .block-search {
margin-right: 0;
}
.usp-cont{
top: 173px;
}
.usp-cont ul li:nth-child(n+3),
.hp-banner-top__text li:nth-child(2) {
border-right: none;
}
.menu-layout-1 .menu-expand:not(.full-list) .menu-pic:not(.second-menu) {
border-bottom: none;
border-bottom: 3px solid #EDF0F0;
padding-bottom: 24px;
margin-bottom: 24px !important;
}
#main_navigation>li>a {
padding: 24px 8px;
justify-content: center;
color: #4E5252;
min-width: 80px;
font-size: clamp(12px, 1.4vw, 16px) !important;
line-height: 16px;
}
#main_navigation>li>a:hover {
color: #000;
}
.menu-layout-1 li.menu-expand .expand-level li.full {
margin-top: 0px;
height: 14px;
}
li.menu-expand::before {
display: none;
}
#main_navigation>li.main-menupoint.is-open>a {
font-weight: 600;
}
ul.menu-pic li.full,
ul.menu-pic-2 li.full,
.menu-pic-3 li.full,
#main_navigation .menu-expand.expand-level.d-col li.full a {
line-height: 14px;
}
ul.menu-pic.second-menu li {
flex-basis: auto;
}
ul.menu-layout-1>li.menu-expand {
flex-basis: 80%;
margin: 0;
}
ul.menu-layout-1>li.menu-expand:last-child {
margin-top: 0px;
}
li.menu-expand ul.menu-pic.second-menu li a {
flex-direction: row;
gap: 32px;
}
ul.menu-layout-1>li.menu-expand.full-list {
flex-basis: 100%;
border-right: none;
}
li.menu-expand .expand-level .menu-img {
height: 70px;
min-width: 104px;
width: 104px;
}
li.menu-expand .expand-level .menu-img img {
width: auto;
height: 48px;
}
li.menu-expand.paving-first .expand-level img {
width: 124px;
height: 84px;
}
.logo img.max {
max-width: 187px;
width: 187px;
}
.account .order-history-title h1 .order-number,
.account .order-history-title h1 .order-status{
display: inline-flex;
margin-top: 24px;
}
.account .order-history-title h1{
margin-bottom: 0;
border-bottom: none;
}
.account .order-history-title h2{
border-bottom: none;
}
.account .order-history-title .title-and-print{
margin-bottom: 0;
border-bottom: 1px solid #D1D6DA;
}
.account .order-info-boxes{
gap: 32px;
flex-wrap: nowrap;
}
.account .order-info-col{
margin-right: 0;
}
.account .cart-header>label{
display: flex;
align-items: center;
margin: 0;
padding: 0;
}
.account .cart .cart-item .cart-item-line-price{
text-align: left;
}
.account .order-info-col dl dd address {
min-height: 100px;
}
.account .order-details-items.order-history-page h2 {
margin-bottom: 24px;
}
}
@media(min-width:1024px) {
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon .counter.qty .ls-basket-count {
font-size: 14px;
}
.usp-cont {
top: 173px;
}
#main_navigation>li>a {
min-width: 110px;
}
li.menu-expand.paving-first .expand-level img {
width: 140px;
height: 90px;
}
.account button.cart-round-button__hollow{
height: 44px;
margin-bottom: 64px;
}
.account .extra-information-container{
display: inline-block;
width: 48%;
margin-right: 32px;
float:left;
}
.account .order-details-items.order-history-page {
margin-top: 0;
display: inline-block;
/*position: relative;*/
width: 48%;
float: left;
}
.account .order-info-col{
flex-basis: 48%;
}
.account .order-details-items.order-history-page .items-ordered-container{
/*position: absolute;*/
/*top: -495px;*/
width: 100%;
}
.account .order-extras li:last-child,
.account .order-extras li:last-child span:first-child,
.account .order-extras li:last-child span:last-child{
margin-bottom: 0;
}
.account .cont_buttons{
position: relative;
margin-bottom: 64px;
float:left;
}
.account .cont_buttons .order-history-page-buttons{
/*position: absolute;*/
/*top: -90px;*/
/*left: calc(48% + 32px);*/
max-width: 206px;
}
.account .order-history-title h1{
font-size: 40px;
}
.account .order-history-title h1 .order-number,
.account .order-history-title h1 .order-status{
margin-top: 48px;
font-size: 24px;
}
.account .order-history-title h1 .order-status {
font-size: 28px;
}
.account .order-history-title h2,
.account .order-info-boxes h2,
.account .order-details-items.order-history-page h2,
.account .extra-information-container h2{
font-size: 28px;
}
.account .totals,
.account .order-history-info,
.account .order-info-col dl dd,
.account .order-info-col dl dd address,
.account .order-info-col dl dd address a,
.account .order-extras li span,
.account .items-ordered-container .cart-item>div,
.account .cart-header>label{
font-size: 16px;
line-height: 24px;
}
.account .order-info-col dl dd address {
min-height: 120px;
}
.sales-order-view .cart-item-details{
width: 40%;
}
.account .cart-item-units,
.account .cart-item-price,
.account .cart-item-quantity,
.account .cart-item-line-price{
width: 15%;
}
}
@media(min-width:1280px) {
.main-menupoint.is-open>ul {
flex-direction: row;
}
.page-header .hca-top-links {
padding-right: 24px;
}
.logo img.max {
max-width: 273px;
width: 273px;
min-height: 48px;
}
.header-container .block-search .block-content .minisearch {
max-width: 394px;
margin-left: calc(20% - 20px);
}
.page-header .hca-top-links ul {
margin-right: auto;
}
.header-container .block-search {
grid-area: 2 / 3 / span 1 / span 1;
}
#main_navigation>li>a {
padding: 24px 20px;
}
.main-menupoint.is-open>ul {
padding: 32px 24px;
}
.header-container .block-search .block-content .cheshire-call {
top: 0;
right: auto;
left: 76%;
white-space: nowrap;
}
.header-container .block-search .block-content .cheshire-call .call-img {
width: 32px;
height: 32px;
}
ul.menu-layout-1 {
column-gap: 0;
}
li.menu-expand.paving-first .expand-level img {
width: 185px;
height: 125px;
}
ul.menu-layout-1>li.menu-expand:not(.paving-first):first-child {
flex-basis: auto;
}
.grid-container:has(.ls-redesign),
.grid-container-lg:has(.ls-redesign) {
padding-bottom: 0;
}
.header-container .hc-actions-container .login {
display: none;
}
.header-container .hc-actions-container {
gap: clamp(16px, 2vw, 32px);
justify-content: flex-start;
}
.header-container .block-search .block-content .minisearch {
margin-right: auto;
}
.header-container .hca-aa-icons a[title="My Account"] {
background-size: 32px 32px;
height: 32px;
width: 32px;
flex-basis: 32px;
}
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon {
height: 32px;
width: 36px;
}
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon .counter.qty,
.header-container .hc-actions-container .minicart-wrapper .ls-basket-icon .counter.qty.ls-empty {
background-size: 36px 32px;
height: 32px;
width: 36px;
}
.header-container .block-search .block-content .cheshire-call .call-txt {
display: block;
}
.menu-layout-1 .menu-expand:not(.full-list) .menu-pic:not(.second-menu) {
border-bottom: none;
padding-right: 64px;
}
ul.menu-layout-1>li.menu-expand:nth-child(2) {
border-left: 4px solid #EDF0F0;
max-height: 470px;
padding-top: 16px;
}
ul.menu-layout-1>li.menu-expand:nth-child(2) .menu-expand{
gap: 48px;
}
.menu-layout-1 li.menu-expand:first-child .expand-level li.full{
margin-top: 16px;
margin-bottom: 24px;
}
li.menu-expand.paving-first .expand-level .mega-menu-link{
gap: 24px;
}
.account .order-details-items.order-history-page .items-ordered-container{
/*top: -572px;*/
}
.account .order-info-boxes h2,
.account .order-details-items.order-history-page h2,
.account .extra-information-container h2{
padding-bottom: 48px;
margin-bottom: 64px;
}
.account .order-extras li span,
.account .order-extras li:last-child span:first-child{
margin-bottom: 32px;
}
}
@media(min-width:1600px) {
.page-header .hca-top-links {
padding-right: 0;
}
.header-container .hc-logo-container {
margin: 0;
}
.main-menupoint.is-open>ul {
padding: 32px 122px 0;
}
#main_navigation>li>a {
white-space: nowrap;
min-width: 174px;
}
.header-container .block-search .block-content .minisearch {
min-width: 512px;
margin-left: calc(25% - 30px);
}
li.menu-expand ul.menu-pic.second-menu {
padding-left: 64px;
}
.menu-layout-1 li.menu-expand:first-child .expand-level li.full {
margin-top: 32px;
margin-bottom: 32px;
}
li.menu-expand.paving-first .expand-level .mega-menu-link{
gap: 32px;
}
ul.menu-layout-1>li.menu-expand:last-child {
margin-top: 0;
}
.menu-layout-1 .menu-expand:last-child:not(.paving-first) .menu-pic {
height: fit-content;
gap: 64px;
padding-top: 16px;
}
ul.menu-layout-1>li.menu-expand:nth-child(2){
max-height: 570px;
}
.menu-layout-1 .menu-expand:last-child:not(.paving-first) .menu-pic .full {
margin-bottom: 0;
}
.page-header .hca-top-links ul {
column-gap: 24px;
}
.header-container .block-search .block-content .cheshire-call {
left: 80%;
}
li.menu-expand.paving-first .expand-level img {
width: 240px;
height: 160px;
}
.menu-layout-1 .menu-expand .menu-pic{
gap: 32px;
}
.account .order-details-items.order-history-page .items-ordered-container {
/*top: -522px;*/
}
}
/* New Header Design */
/* PLP fixes */
@media (max-width:1023px){
.cheshire-hp.choose-cheshire {
margin: 0;
}
}
/* PLP fixes */
/* view order */
.account .rectangle-button { font-size: 16px;width:100% !important;max-width: none !important;}
.account address:first-line { font-weight:400 !important;}
.account .cart-header>label:last-child { justify-content: end}
.account .cart .cart-item .cart-item-line-price {text-align: right;}
.account button {font-family: var(--font-text-regular);}
.account .totals .price { padding-right: 0;}
@media (min-width:768px){
.account .rectangle-button { width: max-content !important;}
}
@media (min-width:1024px){
.account .order-info-boxes h2 {line-height:1.2em;margin-top:64px;}
.account .order-history-title > h2 { margin-top:48px;}
.account .totals strong { font-size: 16px;}
}