* { margin: 0; padding: 0; box-sizing: border-box; }
*:hover, *:focus { outline: none; }

:root {
	--pink: #fd29fc;
	--blue: #1900c7;
	--green: #29fd2f; 

	--font-size-xs: 10.24px;
	--font-size-sm: 12.8px;
	--font-size-base: 16px;
	--font-size-md: 20px;
	--font-size-lg: 25px;
	--font-size-xl: 31.25px;
	--font-size-2xl: 39.81px;
	--font-size-3xl: 47.78px;
}

html { text-rendering: optimizeLegibility; -webkit-overflow-scrolling: touch; -webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-size: var(--font-size-base); line-height: 1.5; }
html::-webkit-scrollbar { display: none; }
body { font-family: Agipo, sans-serif; color: #222; font-size: var(--font-size-base); line-height: 1.5; background: #fff; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body.noscroll { overflow: hidden; }

.wr { padding: 1rem; margin: auto; }
.in { max-width: 1440px; margin: 0 auto; position: relative }

@media (min-width:480px) {
    .wr { padding: 1rem; }
    .in { max-width: 768px; }
}

@media (min-width:1024px) {
    .wr { padding: 1rem 1.5rem 1rem 1.5rem; }
    .in { max-width: 1024px; display: flex; flex-wrap: wrap; justify-content: center; }
}

@media (min-width:1280px) {
    .wr { padding: 1rem 4rem; }
	.in { max-width: 1280px; }
}

a { 
	text-decoration: underline; 
	cursor: pointer; 
	color: #222; 
	transition: .3s ease; 
}
header a {
	text-decoration: none;
}
a:hover { 
	color: #222; 
}

.btn,
a.btn { 
	background: #000; 
	color: #fff !important; 
	font-stretch: normal;
	border: none; 
	padding: 6px 12px; 
	transition: .3s ease background; 
}


/* HOME */
.cover-image { background-size: cover; background-repeat: no-repeat; background-position: center; /*position: fixed; top: 0; right: 0; bottom: 0; left: 0;*/ flex: 1 1 100%; height: 100vh; }
.enter-site { position: absolute; top: 0; left: 0; z-index: 100; width: 100%; text-align: left; color: #fff; }
#main .enter-site ul { list-style: none; font-family: Correspondance, sans-serif; font-size: var(--font-size-lg); line-height: 1; margin: 1rem; padding: 0; }
#main .enter-site ul li { margin: 0 0 .5rem 0; padding: 0; }
#main .enter-site ul li a { color: #fff; } 

@media screen and (min-width: 480px ) {
	.enter-site { display: none; }
	.cover-image { background-size: contain; }
}

/* LA FETICHE OVERLAY */
svg.cover-logo { 
	display: none; 
	z-index: 2000; 
}
.collection svg.cover-logo,
.about svg.cover-logo,
.stockists svg.cover-logo,
.news svg.cover-logo,
.atelier svg.cover-logo,
.artists svg.cover-logo,
.press svg.cover-logo,
.contact svg.cover-logo,
.basket svg.cover-logo { display: block; }

.shop svg.cover-logo { display: block; opacity: 1; }

svg.cover-logo { 
	width: calc(100% - 1.75rem);
	position: fixed; 
	left: 1rem; 
	bottom: 0; 
	transform: translateY(55%);
	z-index: 1000; 
	pointer-events: none; 
}

.home svg.cover-logo {
	display: block;
	transform: translateY(-10%);
}

@media screen and (min-width: 480px) {
	svg.cover-logo { 
		width: calc(100% - 4.25rem);
		left: 2.625rem;	
	}
}

body.c1-pink .cover-image { background-image: url(../img/lafetiche-202109-pink.jpg); }
body.c1-pink svg.cover-logo { fill: var(--blue) /*#fd29fc*/; }
/* body.c1-pink #main-nav ul li a:hover, */
body.c2-pink #main p a,
body.c2-pink.contact #main p a,
body.c2-pink span.hilite,
/*body.c2-pink h3,*/
body.c2-pink.contact h1,
body.c2-pink h2.news-announcement a,
body.c2-pink .vat-btn,
body.c1-pink #main ul.nav2 li.active > a
/*, body.c2-pink h2.news-announcement*/ { color: var(--pink); }
body.c1-pink .btn:hover, 
body.c1-pink a.btn:hover, /* body.c1-pink #main .product-continue-shopping a:hover */
body.c1-pink input.add-to-basket:hover { background: var(--pink); }
body.c1-pink .product-size .size-options input[type="radio"]:active+label .size,
body.c1-pink .product-colour .colour-options input[type="radio"]:active+label .colour { background: var(--pink); border-color: var(--pink); }

body.c1-blue .cover-image { background-image: url(../img/lafetiche-202109-blue.jpg); }
body.c1-blue svg.cover-logo { fill: var(--green) /*var(--blue)*/; }
body.c1-blue #main-nav ul li a:hover,
body.c2-blue h2.news-announcement a,
body.c2-blue #main p a, 
body.c2-blue.contact #main p a, 
body.c2-blue span.hilite, 
/* body.c2-blue h3,  */
body.c2-blue.contact h1, 
body.c2-blue .vat-btn, 
body.c1-blue #main ul.nav2 li.active > a, 
body.c2-blue h2.news-announcement { color: var(--blue); }
body.c1-blue .btn:hover, 
body.c1-blue a.btn:hover, /* body.c1-blue #main .product-continue-shopping a:hover */
body.c1-blue input.add-to-basket:hover { background: var(--blue); color: #fff; }
body.c1-blue .product-size .size-options input[type="radio"]:active+label .size,
body.c1-blue .product-colour .colour-options input[type="radio"]:active+label .colour { background: var(--blue); border-color: var(--blue); }

body.c1-green .cover-image { background-image: url(../img/lafetiche-202109-green.jpg); }
body.c1-green svg.cover-logo { fill: var(--pink) /*var(--green)*/; }
body.c1-green #main-nav ul li a:hover,
body.c2-green h2.news-announcement a,
body.c2-green #main p a, 
body.c2-green.contact #main p a, 
body.c2-green span.hilite, 
/* body.c2-green h3,  */
body.c2-green.contact h1, 
body.c2-green .vat-btn, 
body.c1-green #main ul.nav2 li.active > a, 
body.c2-green h2.news-announcement { color: var(--green); }

body.c1-green .btn:hover, 
body.c1-green a.btn:hover, /* body.c1-green #main .product-continue-shopping a:hover */
body.c1-green input.add-to-basket:hover { background: var(--green); color: #fff; }
body.c1-green .product-size .size-options input[type="radio"]:active+label .size,
body.c1-green .product-colour .colour-options input[type="radio"]:active+label .colour { background: var(--green); border-color: var(--green); }

p a { color: var(--green); }

/* @media screen and (min-width: 768px) {
	body.c1-pink #main-nav ul li.active a { color: var(--pink); mix-blend-mode: multiply; opacity: .75; }
	body.c1-blue #main-nav ul li.active a { color: var(--blue); mix-blend-mode: multiply; opacity: .75; }
	body.c1-green #main-nav ul li.active a { color: var(--green); mix-blend-mode: multiply; opacity: .75; }
} */

.row > a {
	text-decoration: none;
}

/*
.row {
	margin-right: 0;
	margin-left: 0;
}
.row > [class^="col-"],
.row > [class*=" col-"] {
	padding-right: 9px;
	padding-left: 9px;
}

.row.no-gutters {
	margin-right: 0;
	margin-left: 0;
}
.row.no-gutters > [class^="col-"],
.row.no-gutters > [class*=" col-"] {
	padding-right: 0;
	padding-left: 0;
}
*/

/* header */
#header { 
	position: fixed; 
	z-index: 1000; 
	width: 100%; 
	top: 0; 
}
#nav-toggle { 
	position: fixed; 
	z-index: 10000; 
	top: 1.5rem;
	right: 1rem;
	outline: none;
	cursor: pointer;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	appearance: none;
	border: 0;
	background: none;
}
#nav-toggle svg {
	display: block;
	width: 100%;
	height: auto;
	object-fit: contain;
	color: #222;
}
@media (min-width:768px) {
	#nav-toggle { 
		right: 2.5rem; 
	}
}

#main-nav ul { 
	list-style: none; 
	font-weight: normal; 
	font-family: Correspondance, sans-serif; 
	line-height: 1; 
	text-transform: uppercase; 
}
#main-nav ul li a { 
	text-decoration: none; 
	mix-blend-mode: multiply; 
}

/* body.c1-pink input.add-to-basket { background: var(--pink); }
body.c1-blue input.add-to-basket { background: var(--blue); }
body.c1-green input.add-to-basket { background: var(--green); } */

#main-nav { 
	height: 100vh; 
	background-color: #fff; var(--pink); 
	/* background-image: url('/img/lafetiche-menu-bg-pink.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;  */
	position: fixed;
	inset: 0;
	transform: translateX(100%);
	transition: .3s ease-in-out;
	overflow: hidden;
}
body.open-nav #main-nav { 
	transform: translateY(0);
	transition: .3s ease-in-out;
}


#main-nav .inner {
	display: flex; 
	flex-wrap: wrap;
	align-items: flex-start; 
	justify-content: flex-start; 
	padding: 0; /* 1.5rem 1.5rem 0 1.5rem;*/
	gap: 2rem;
}
@media (min-width:768px) {
	#main-nav {
		width: 33.33%;
		inset: unset;
		top: 0;
		right: 0;
	}
	#main-nav .inner { 
		padding: 0; /* 2.5rem 0 2.5rem; */
		padding: 0; /*4rem 2.5rem 0;*/
	}
}
#main-nav .inner .nav-group {
	flex: 0 0 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: flex-start;
	padding: 1.5rem 1.5rem;
	position: absolute;
	top: 0;
	left: 0;
	/* background-color: var(--pink); 
	background-image: url('/img/lafetiche-menu-bg-pink.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;  */
	height: 100%;
	overflow: hidden;
	overflow-y: auto;
}
#main-nav .inner .nav-group-inner {
	flex: 0 0 100%;
	display: flex; 
	flex-wrap: wrap;
	gap: 1.5em;
	
}

#main-nav .inner .nav-group:nth-child(2) {
	z-index: 200; 
}
#main-nav .inner .nav-group:nth-child(3) {
	z-index: 300; 
}
#main-nav .inner .nav-group:nth-child(4) {
	z-index: 400; 
}
#main-nav .inner .nav-group:not(.active) { /*:nth-child(1)) {*/
	/* position: absolute;
	top: 0;
	left: 0; */
	/* display: none; */
	transform: translateX(100%);
	transition: .2s ease-out;
}
#main-nav .inner .nav-group.active { /*:not(:nth-child(1)).active {*/
	display: flex;
	transform: translateX(0);
	transition: .2s ease-out;
}
#main-nav .inner .nav-group.active.subnav-active {
	transform: translateX(-100%);
	transition: .2s ease-out;
}
@media (min-width:768px) {
	#main-nav .inner .nav-group {
		/* display: none; */
		/* position: static !important; */
		/* transform: none !important; */
		/* flex: 0 0 calc(33.33% - 2rem); */
	}
	#main-nav .inner .nav-group:not(:nth-child(1)) {
		/* display: none; */
	}
}
#main-nav button.hide-nav-group {
	display: block;
	appearance: none;
	border: 0;
	background: none;
	cursor: pointer;
	padding: 0;
	flex: 0 0 100%;
	font-size: var(--font-size-sm); 
	text-transform: uppercase;
	color: #222;
	text-align: left;
	margin: 0;
	overflow-y: auto;
}
@media (min-width:768px) {
	#main-nav button.hide-nav-group { 
		/* display: none;  */
	}
}


#main-nav ul { 
	flex: 0 0 100%;
	font-size: var(--font-size-xl); 
	margin: 0; 
	background: none;
	display: flex;
	flex-wrap: wrap;
	gap: .5em;
}
#main-nav ul.secondary-nav { 
	font-size: var(--font-size-sm);
	line-height: 1;
	gap: .5em;
}
#main-nav ul li { 
	display: block; 
	flex: 0 0 100%;
}
#main-nav ul li a { 
	display: block; 
	position: relative; 
	z-index: 100; 
	text-align: left; 
	color: #222; 
}

#main-nav .inner .nav-group:not(:nth-child(1)) ul {
	/* font-size: var(--font-size-sm); */
	gap: .25em;
}

body.open-nav { overflow: hidden; }


h1.h1,
h2.h1, 
div.h1 { 
	font-weight: normal; 
	font-family: Correspondance, sans-serif; 
	margin: 0;
	padding: .75rem 1rem; 
	line-height: 1; 
	font-size: var(--font-size-3xl); 
	position: relative;
}

@media (min-width: 768px) {
	h1.h1, 
	h2.h1, 
	div.h1 { 
		padding: .75rem 2.5rem;
	}
}
h1.h1 .small, 
h2.h1 .small, 
div.h1 .small { 
	font-size: 100%; 
	font-family: Agipo; 
	font-weight: bold; 
	text-transform: lowercase; 
}

h1.mobile-title, 
h2.mobile-title { 
	display: inline-block; 
	background: #fff; 
	position: absolute; 
	top: 15px; 
	left: 21px; 
	font-weight: normal; 
	font-family: Correspondance, sans-serif; 
	margin: 0; 
	line-height: 45px; 
	font-size: 45px;  
	z-index: 1005; 
}
h1.mobile-title .small, 
h2.mobile-title .small { 
	font-size: 30px; 
	line-height: 30px; 
	font-family: Agipo; 
	font-weight: bold; 
	text-transform: lowercase; 
}

body.contact h1 { color: #000 !important;}

div.nav2 { margin: 0; }
div.nav2 ul,
div.subnav-wrap ul.nav2 { display: none; }
div.nav2.active ul,
div.subnav-wrap.open-sub-nav ul.nav2 { display: block; }

/* todo 22.6.25 just remove page-title from pages */
h1.page-title { display: none; }

body.news h1.page-title,
body.artists h1.page-title,
body.makers h1.page-title,
body.press h1.page-title,
body.atelier h1.page-title { 
	display: block; 
	font-family: Correspondance, sans-serif; 
	font-weight: normal; 
	font-size: var(--font-size-2xl); 
	line-height: 1;
	margin: .5em 0; 
	text-align: center;
}

h2.page-title2 { font-weight: normal; font-family: Correspondance, sans-serif; margin: 6px 0 20px 0; line-height: 14px; font-size: var(--font-size-md); letter-spacing: 0px; }

.mobile-hidden { display: none; }

#current-selection { cursor: pointer; padding: 9px 21px; border-top: 2px solid #ccc; border-bottom: 2px solid #ccc; font-weight: normal; font-family: Correspondance, sans-serif; margin-bottom: 15px; text-transform: uppercase; font-size: 24px; line-height: 46px; }

#main .title-wrap {
	flex: 0 0 100%;
	padding: 0 1.5rem;
}


.collection-content { width: 300px; margin: 6rem auto; text-align: center; }
.collection-content.video iframe { display: block; width: 300px; height: 533px; }

.collection-content span { display: block; text-indent: -999999px; height: 50px; background-size: contain; background-position: center; background-repeat: no-repeat; }

.collection-content span.svg-lafetiche { background-image: url(../img/LAFETICHE.svg); }
.collection-content span.svg-lookbook { background-image: url(../img/LOOKBOOK.svg); }
.collection-content span.svg-orderform { background-image: url(../img/ORDERFORM.svg); }
.collection-content span.svg-linesheet { background-image: url(../img/LINESHEET.svg); }
.collection-content span.svg-pressreview { background-image: url(../img/PRESSREVIEW.svg); }
.collection-content span.svg-productshots { background-image: url(../img/PRODUCTSHOTS.svg); }

.collection-content img { display: block; width: 100%; position: relative; top: -2.5rem; z-index: -1; }
.collection-content.has-img { margin-bottom: 3.5rem; }


.section { margin-top: 48px; }

#main p { margin: 0 0 1em 0; font-stretch: expanded; }
#main ul,
#main ol { color: #222; margin: 0 0 1em 1em; font-stretch: expanded; }
#main.about p:last-child { margin-bottom: 210px; }

#main-nav .small,
.enter-site .small { font-size: 100%; font-family: Agipo; font-weight: bold; text-transform: lowercase; }

#main h3,
#main .h3 { 
	font-family: Correspondance, sans-serif; 
	font-weight: normal; 
	font-size: var(--font-size-base); 
	line-height: 1.5; 
	margin: 1em 0 0 0; 
}

#main .content { max-width: 32rem; margin: 0 auto; padding-bottom: 10rem; }
#main .content > h3 { margin-top: .5em; }

@media (min-width:768px) {
	#main .content { width: 32rem; }
	body.contact .content { text-align: center; }
}

@media (min-width:1024px) {
	#main .content { width: 42rem; max-width: 100%; }
}
#main .content .pic {
	margin: 1rem auto;
}
#main .content .pic img {
	display: block;
	width: 100%;
	margin: 0 0 .5rem 0;
}

#main .content p:has(img) {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1rem;
} 
#main .content p:has(img + img) {
	justify-content: space-between;
}
#main .content p img {
	flex: 0 0 100%;
	display: block;
	max-width: 100%;
	height: auto;
}
#main .content p img:has(+ img) {
	flex: 0 0 calc(50% - 10rem);
}
#main .content p img:nth-child(2) {
	flex: 0 0 calc(50% - 10rem);
}

@media (max-width:769px) {
	#main .content p img {
		width: 100%;
	}
}

@media (min-width:768px) {
	#main .content p img:has(+ img) {
		flex: 0 0 16rem;
	}
	#main .content p img:nth-child(2) {
		flex: 0 0 16rem;
	}
}

@media (min-width:1024px) {
	#main .content p img:has(+ img) {
		flex: 1 0 20rem;
	}
	#main .content p img:nth-child(2) {
		flex: 1 0 20rem;
	}
}



.banner.sale {
	background: #fff;
	color: #222;
	text-align: center;
	padding: 1rem;
	border: 1px solid #222;
	margin: 0 .75rem 1rem 0;
}
.banner.sale h2 {
	font-family: Correspondance, sans-serif;
	font-size: 31.25px;
	font-weight: normal;
	margin: 0;
}
#main .banner.sale p {
	font-size: var(--font-size-base);
	margin: 0;
}


/* .shop-title {
	flex: 0 0 100%;
	padding: 1rem 1.5rem;
}

.shop-title h1 {
	font-family: Correspondance, sans-serif;
	font-weight: normal;
	font-size: var(--font-size-3xl);
	line-height: 1;
	margin: 0;
} */

/* @media (min-width:768px) {
	.shop-title {
		padding: 0 1.5rem;	
		position: fixed;
		width: 100%;
		top: 3rem;
		left: 0;
		z-index: 10;
	}
}  */


.grid-products-toolbar-toggle {
	display: block;
	position: fixed;
	top: 1.25rem;
	right: 5rem;
	z-index: 10000;
	appearance: none;
	color: #222;
	border: 0;
	background: none;
	cursor: pointer;
	transition: .2s ease-in-out;
}
body.open-toolbar .grid-products-toolbar-toggle {
	right: 1.5rem;
}
@media (min-width:768px) {
	.grid-products-toolbar-toggle { 
		right: 7rem; 
	}
	body.open-toolbar .grid-products-toolbar-toggle {
		right: 2.5rem;
	}
}
button.grid-products-toolbar-toggle svg {
	display: block;
	color: #222;
	width: 2rem;
	height: 2rem;
	object-fit: contain;
}


/* .grid-products-wrap { margin: 1.5rem; } */

@media (min-width:768px) {
	.grid-products-wrap { 
		flex: 0 0 100%; 
		margin: 0 0 0 0;
		padding: 0;
	}

	body.wishlist .grid-products-wrap { 
		flex: 0 0 100%;
		margin: 0; 
		padding: 1rem 0;
	}
	body.wishlist .grid-products-wrap .wishlist-actions {
		padding: 1rem 2.5rem 0;
	}
}

.grid-products-toolbar { 
	display: flex; 
	flex-wrap: wrap; 
	gap: .25rem 1rem; 
	margin: 0 0 1rem 0; 
	padding: .5rem 4rem .5rem .5rem;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	background-color: var(--green);
	z-index: 1100;
	margin: 0;
	padding: .5rem 5rem .5rem 1rem;
	transform: translateY(-100%);
	transition: transform .2s ease-out;
}
.grid-products-toolbar.active {
	transform: translateY(0);
	transition: transform .3s ease-in-out;
}

@media (min-width:768px) {
	.grid-products-toolbar { 
		/* display: none; */
		/* margin: 0 .5rem .5rem .5rem;  */
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: auto;
		background-color: var(--green);
		z-index: 1100;
		margin: 0;
		padding: .5rem 7rem .5rem 2.5rem;
		transform: translateY(-100%);
		transition: transform .2s ease-out;
	}
	.grid-products-toolbar.active {
		transform: translateY(0);
		transition: transform .3s ease-in-out;
	}
	/* .grid-products-toolbar * {
		display: none;	
	} */
}

#collection-wrap,
#category-wrap { 
	position: relative;
	flex: 0 0 100%;
	border: 0;
	margin: 0;
	font-family: Correspondance, sans-serif;
}

@media (min-width:768px) {
	#collection-wrap,
	#category-wrap { 
		flex: 0 0 calc(25% - 1rem); 
	}
}

#collection-wrap a,
#category-wrap a { text-decoration: none; display: block; padding: 1rem 1rem 1rem 1rem; /* color: #bdbdbd; */ }

#collection-wrap a.active,
#category-wrap a.active { 
	border: 1px solid transparent; 
	color: #222; 
}
#collection-wrap a.active::after,
#category-wrap a.active::after { 
	content: ' '; 
	background-image: url('/img/angle-down-sharp-solid.svg'); 
	background-repeat: no-repeat; 
	background-size: contain; 
	background-position: center; 
	width: 1rem; 
	height: 1rem; 
	position: absolute; 
	top: 1.325rem; 
	right: 1.25rem; 
	z-index: 1000; 
}
#collection-wrap a.active:hover,
#collection-wrap.active a.active,
#category-wrap a.active:hover,
#category-wrap.active a.active { 
	border-color: #222; 
}

#collection-wrap ul,
#category-wrap ul {
	border: 1px solid #222; 
	border-top: 0; 
	display: none; 
	position: absolute; 
	z-index: 100;
	background: #fff; 
	top: 3.5rem; 
	left: 0; 
	width: 100%; 
	list-style: none; 
	margin: 0; 
	padding: 0 0 1rem 0; 
	font-size: var(--font-size-sm);
	line-height: 1;
}
#collection-wrap ul ul,
#category-wrap ul ul {
	border: 0;
	position: static;
	padding: 0;
}
#collection-wrap.active ul,
#category-wrap.active ul { 
	display: block; 
}
#collection-wrap li,
#category-wrap li { 
	margin: 0; 
	padding: 0; 
}
#category-wrap ul ul li a {
	padding-left: 2rem;
}
#collection-wrap li a,
#category-wrap li a { 
	display: block; 
	padding: .5rem 1rem; 
}
#collection-wrap li a:hover,
#category-wrap li a:hover { 
	background: #f7f7f7; 
	color: #222; 
}






#search-wrap {  position: relative; flex: 0 0 100%; border: 0; margin: 0; /* box-shadow: 0 0 1rem rgba(0,0,0,.1); */ }
/* #search-wrap .search-icon { pointer-events: all; position: absolute; top: 1.125rem; right: 1.25rem; z-index: 100; background-image: url('/img/magnifying-glass-sharp-regular.svg'); background-size: 1rem 1rem; background-repeat: no-repeat; background-position: center; width: 1.25rem; height: 1.25rem; } */
#search-wrap.has-keyword .search-icon { cursor: pointer; background-image: url('/img/xmark-large-sharp-solid.svg'); background-size: 1rem 1rem; }
#search { 
	background: transparent; 
	padding: 1rem; 
	/* font-family: Correspondance; 
	text-transform: uppercase;  */
	border-radius: 0; 
	font-stretch: expanded;
	border: 1px solid transparent; 
	width: 100%; 
}
#search:focus { border-color: #222; }
#sort-by { 
	/* font-family: Correspondance;  */
	font-stretch: expanded;
	position: relative; 
	flex: 0 0 100%; 
	padding: 0; 
	margin: 0; 
	/* box-shadow: 0 0 1rem rgba(0,0,0,.1);  */
}

#sort-by a { text-decoration: none; display: block; padding: 1rem 1rem 1rem 1rem; /* color: #bdbdbd; */ }

#sort-by a.sort-by-active { border: 1px solid transparent; color: #222; }
#sort-by a.sort-by-active::after { content: ' '; background-image: url('/img/angle-down-sharp-solid.svg'); background-repeat: no-repeat; background-size: contain; background-position: center; width: 1rem; height: 1rem; position: absolute; top: 1.325rem; right: 1.25rem; z-index: 1000; }
#sort-by a.sort-by-active:hover,
#sort-by.active a.sort-by-active { border-color: #222; }

#sort-by ul { 
	border: 1px solid #222; 
	border-top: 0; 
	display: none; 
	position: absolute; 
	z-index: 100; 
	background: #fff; 
	top: 3.5rem; 
	left: 0; 
	width: 100%; 
	list-style: none; 
	margin: 0; 
	padding: .25rem 0; 
	/* font-size: var(--font-size-sm);  */
	line-height: 1; 
}
#sort-by.active ul { display: block; }
#sort-by li { margin: 0; padding: 0; }
#sort-by li a { display: block; padding: .5rem 1rem; }
#sort-by li a:hover { background: #f7f7f7; color: #222; }
@media (min-width:768px) {
	#search-wrap { flex: 1 0 calc(50% - 1rem); }
	#sort-by { flex: 0 0 calc(25% - 1rem); }
}

#grid-products-no-results { 
	padding: 4rem 1.5rem; 
}
@media (min-width:768px) {
	#grid-products-no-results {
		padding: 6rem 2.5rem;
	}
}
#grid-products-no-results ul { margin-left: 0; }
#grid-products-no-results ul li { list-style: none; }
#grid-products-no-results a { color: var(--blue); }

.grid-products { 
	display: flex; 
	flex-wrap: wrap;
	justify-content: flex-start; 
	flex: 0 0 100%; 
	gap: 0;
	/* products-padding */
	/* margin: 0 1.5rem; */
}

.grid-products .grid-product {
	position: relative;
	flex: 0 0 50%;
}

.grid-product a {
	text-decoration: none;
}

.grid-products .grid-product .product-inner { position: relative; }
/* .grid-products .grid-product a[data-sale] .product-inner::after {
	content: 'SALE';
	position: absolute;
	top: .25rem;
	left: .25rem;
	font-size: var(--font-size-xs);
	line-height: 1;
	padding: .25em .25em .125em;
	background: var(--blue);
	color: #fff;
} */
.grid-products .grid-product a[data-outofstock] .product-inner::after {
	content: 'SOLD OUT';
	position: absolute;
	top: .5rem;
	left: .5rem;
	z-index: 10;
	font-size: var(--font-size-xs);
	line-height: 1;
	padding: .25em .25em .125em;
	background: #757575;
	color: #fff;
}
.grid-products .grid-product a[data-restock] .product-inner::after {
	content: 'COMING SOON';
	position: absolute;
	top: .5rem;
	left: .5rem;
	z-index: 10;
	font-size: var(--font-size-xs);
	line-height: 1;
	padding: .25em .25em .125em;
	background: #000;
	color: #fff;
}
.grid-products .grid-product .product-hover-image { 
	opacity: 0; 
	position: absolute; 
	top: 0; 
	left: 0;
	z-index: 1;
	width: 100%; 
	height: auto; 
	transition: .2s all ease-out; 
}
.grid-products .grid-product .product-image img,
.grid-products .grid-product .product-hover-image img { 
	display: block; 
	width: 100%; 
	height: auto; 
	aspect-ratio: 2/3; 
	object-fit: cover; 
}
.grid-products .grid-product a.active.hovered .product-hover-image { 
	opacity: 1; 
	z-index: 1; 
	transition: .2s all ease-out; 
}
/* .grid-products .grid-product.has-hover-image a.active.hovered .product-image { 
	opacity: 0; 
} */
/* .grid-products .grid-product.has-hover-image:hover .product-image { 
	opacity: 0; 
} */
/* .grid-products .grid-product:hover .product-info { 
	opacity: 0; 
} */

.grid-products .grid-product .product-info { 
	padding: .5rem 1rem; 
	display: flex;
	flex-wrap: wrap;
	align-items: last baseline;
	gap: .125em .5em;
	font-stretch: normal;
}
@media (min-width:1024px) {
	.related-products-wrap .grid-products .grid-product {
		flex: 0 0 20%; 
		margin: 0; 
		position: relative; 
	}
}
#main .grid-products .grid-product .product-info h3,
#main .grid-products .grid-product .product-info .h3 { 
	margin: 0; 
	color: #222;
	text-align: left; 
	font-size: var(--font-size-sm); 
	line-height: 1.5;
	font-family: Correspondance, sans-serif; 
	font-weight: normal; 
	flex: 0 1 auto;
}
#main .grid-products .grid-product .product-info p { 
	color: #222; 
	text-transform: none; 
	font-style: italic; 
	font-stretch: normal;
	text-align: left; 
	font-size: var(--font-size-xs); 
	text-transform: uppercase;
	line-height: 1.5; 
	flex: 0 1 auto;
	margin: 0; 
}

#main .grid-products .grid-product .product-info p.product-price { 
	flex: 0 0 100%;
	font-style: normal; 

	font-size: var(--font-size-sm);
	line-height: 1.5;
}
#main .grid-products .grid-product .product-info p.product-price span.strike { 
	text-decoration: line-through; 
}

.related-products-wrap { 
	flex: 0 0 100%;
	text-align: left; 
	margin: 3.5rem auto 0; 
	display: flex;
	flex-wrap: wrap; 
	justify-content: flex-start;
}
#main .related-products-wrap h2 { 
	flex: 1 0 auto; 
	margin: .75rem 1.5rem 0;
	font-size: var(--font-size-lg); 
	font-family: Correspondance;
	text-transform: uppercase;
	font-weight: normal; 
}
.related-products-wrap .grid-products-wrap {
	margin: 3rem 0
}

@media screen and (min-width: 768px) {
	.related-products-wrap { 
		margin: 3.5rem auto 0; 
	}
	#main .related-products-wrap h2 { 
		margin: .75rem 2.5rem 0;
	}
	.related-products-wrap .grid-products-wrap {
		margin: 3rem 0; 
	}
	/* .related-products-wrap .grid-products { justify-content: center; } */
	.grid-products .grid-product { 
		/* flex: 0 0 calc(25% - .375rem);  */
		/* flex: 0 0 calc(33.33% - .34rem);  */
		flex: 0 0 33.33%;
		margin: 0; 
		position: relative; 
	}
	.grid-products .grid-product .product-hover-image { 
		top: 0; 
	}
	.grid-products .grid-product:hover .product-hover-image { 
		top: 0; 
		/*box-shadow: 0 1rem 2rem rgba(0,0,0,.05);*/ 
	}
	.grid-products .grid-product .product-hover-image img { 
		border-bottom: 0; 
		z-index: 2; 
	}
	.grid-products .grid-product .product-hover-image .product-info { 
		display: none;
		align-items: last baseline;
		opacity: 1; 
		transition: .1s all ease; 
		background: #fff; 
		width: 100%; 
		padding: .5rem .5rem .75rem .5rem; 
	}
}

/* @media screen and (min-width: 1024px) {
	.grid-products .grid-product { flex: 0 0 calc(25% - .75rem); margin: 0; position: relative; }
	.grid-products .grid-product .product-hover-image img { 
		border-bottom: 0; 
		z-index: 2; 
	}
	
} */

@media screen and (min-width: 1280px) {
	/* .grid-products-wrap { margin-right: 2.25rem; } */
	/* .grid-products .grid-product { flex: 0 0 calc(20% - .8rem); } */
}

.product-wrap { 
	margin: 0; 
	display: flex; 
	flex-wrap: wrap;
	width: 100%; 
}
.product-header {
	order: 2;
	flex: 0 0 100%;
	position: relative;
}

h1#product-title { 
	font-family: Correspondance, sans-serif; 
	font-weight: normal; 
	font-size: var(--font-size-3xl); 
	line-height: 1; 
	margin: .75rem 1.5rem 0;
}

@media (min-width:768px) {
	.product-header {
		order: 0;
		flex: 0 0 100%;
		height: 0;
		position: relative;
		position: sticky; 
		top: 0;
		z-index: 100;
	}
	h1#product-title {
		font-size: var(--font-size-3xl); 
		margin: .75rem 2.5rem 0;
	}
} 


.slick-product-wrap {
	flex: 0 0 100%;
	width: 100%;
}
.siema .pagination-buttons { 
	display: flex;
	justify-content: center;
	gap: .5rem;
	padding: 1rem 1.5rem;
	display: none;
}
.siema .pagination-buttons button {
	appearance: none;
	background: none;
	border: 0;
	cursor: pointer;
	padding: 0;
	width: .5rem;
	height: .5rem;
	border-radius: 1rem;
	background-color: #ddd;
	color: #ddd;
	overflow: hidden;
}

.product-wrap .product-images-wrap { flex: 0 0 100%; }
.product-wrap .product-images { 
	display: flex; 
	flex-wrap: wrap;
	gap: 0rem;
	padding: 0 1rem;
}

.product-image,
.grid-image {
	flex: 0 0 100%;
}
.product-image img,
.grid-image img {
	display: block; 
	width: 100%; 
	height: auto; 
	aspect-ratio: 2/3; 
	object-fit: cover; 
}
.product-image video,
.grid-image video {
	display: block; 
	width: 100%; 
	height: auto; 
	aspect-ratio: 2/3; 
	object-fit: cover; 
}

.product-wrap .product-info { 
	flex: 0 0 100%; 
	padding: 1.5rem 1.5rem;
	order: 3;
}

@media screen and (min-width: 1024px) {
	.product-wrap { 
		margin: 0; 
		gap: 0;
		/* margin-top: 2.25rem; */
	}
	.product-wrap .product-images-wrap { 
		flex: 0 0 calc(66.67%); 
		height: 100%;
	}
	.product-wrap .product-images { 
		margin: 0 0 0 0; 
		padding: 0; 
		position: sticky;
		top: 4.5rem;
	}
	.product-image,
	.grid-image {
		flex: 0 0 50%;
	}
	.product-wrap .product-info { 
		flex: 0 0 33.3%; 
		margin: 0 0 0 0; 
		padding-left: 1.75rem; 
		padding-right: 2.5rem;
	}
}

@media screen and (min-width: 1280px) {
	/* .product-wrap { margin: 1rem 3rem 0; } */
}

.product-colour { font-size: var(--font-size-sm); text-transform: uppercase; margin: 2em 0; font-weight: bold; }
.product-colour .colour-options-wrap { margin: .5em 0 1em; font-weight: normal; }
.product-colour .colour-options-wrap .select { padding: .75em 1em; display: none; }
.product-colour .colour-options-wrap.active .select,
.product-colour .colour-options-wrap.init .select { display: block; }
.product-colour .colour-options-wrap > span { font-size: var(--font-size-md); font-weight: bold; }

.product-colour .colour-options.flex { 
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.product-colour .colour-options label { 
	cursor: pointer; 
	text-transform: uppercase; 
	display: flex;
	justify-content: space-between;
	border: 1px solid #000;
}

/* #main .product-colour .colour-options label .colour, */
#main .product-colour .colour-options-wrap.init .colour-options input[type="radio"]:checked+label .colour { display: none;}
#main .product-colour .colour-options-wrap.active .colour-options label .colour,
#main .product-colour .colour-options input[type="radio"]:checked+label .colour { display: block; }
.product-colour .colour-options label { cursor: pointer; text-transform: uppercase; }
.product-colour .colour-options label .colour { 
	transition: .3s ease; 
	min-height: 24px; 
	min-width: 24px; 
	padding: .5em 1em; 
	display: flex; 
	justify-content: center; 
	align-items: center; 
	appearance: none;
	border: 0;
	background: none;
	color: inherit;
	text-decoration: none;
}
/* .product-colour .colour-options input[type="radio"]:checked+label .colour { background: #000; color: #fff; border-color: #000; } */

.product-colour .colour-options label:hover {
	box-shadow: 0 0 0 .125rem var(--pink);
}
#main .product-colour .colour-options label.checked {
	background: #000;
	color: #fff;
} 

/*
#main .product-content p,
#main .product-materials p { font-size: var(--font-size-sm); line-height: 20px; margin: 0 60px 10px 0; }
#main .product-content p:first-child { font-size: 18px; line-height: 24px; margin: 24px 0 24px 0; }
*/

#main .product-content p {
	font-size: var(--font-size-sm);
	line-height: 1.5;
	margin: 0 0 1em 0;
	font-stretch: expanded;
}

@media (min-width:768px) {
	#main .product-content {
		margin-right: 4rem;
	}
}

/*#main .product-continue-shopping { font-size: 15px; line-height: 20px; margin: 20px 0 10px 0; text-align: center; font-style: italic; }*/
#main .product-continue-shopping a { 
	display: block; 
	border-radius: 0; 
	/* text-transform: uppercase;  */
	/* border: 1px solid #000;  */
	background-color: #fff; 
	transition: .3s ease background; 
	margin: .5em 0; 
	font-size: var(--font-size-sm);
	line-height: 1.5; 
	padding: .75em 0; 
	font-weight: normal; 
	text-align: center; 
	color: #222; 
	font-stretch: expanded;
	text-decoration: underline !important;
}

.product-wrap .product-price { font-size: 31.25px; line-height: 1; margin: 1em 0 0 0; font-weight: bold; color: var(--pink) }
.product-rrp { text-decoration: line-through; font-size: var(--font-size-md); line-height: 1.5; font-weight: bold; color: var(--green); font-style: normal; display: inline-block; }
table .product-rrp { font-size: var(--font-size-base); font-weight: normal; }
.product-price-small { font-size: var(--font-size-sm); line-height: 1.5; font-weight: normal; color: #222; font-style: normal; display: block; }

.product-size { font-size: var(--font-size-sm); text-transform: uppercase; margin: 2em 0; font-weight: bold; }
.product-size.has-size-guide { margin-bottom: 1em; }
.product-size .size-options-wrap { margin: .5em 0 1em; font-weight: normal; border: 0; }
.product-size .size-options-wrap .select { padding: .75em 1em; display: none; }
/* .product-size .size-options-wrap.active .select,
.product-size .size-options-wrap.init .select { display: block; cursor: pointer; } */
.product-size .size-options-wrap > span { font-size: 24px; font-weight: bold; }

.product-size .size-options.flex { 
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

/* #main .product-size .size-options label .size, */
#main .product-size .size-options label .stock, 
#main .product-size .size-options-wrap.init .size-options input[type="radio"]:checked+label .size,
#main .product-size .size-options-wrap.init .size-options input[type="radio"]:checked+label .stock { display: none; }
#main .product-size .size-options-wrap.active .size-options label .size, 
#main .product-size .size-options-wrap.active .size-options label .stock, 
#main .product-size .size-options input[type="radio"]:checked+label .size,
#main .product-size .size-options input[type="radio"]:checked+label .stock { 
	display: flex; 
}
.product-size .size-options label { 
	cursor: pointer; 
	text-transform: uppercase; 
	display: flex;
	justify-content: space-between;
	border: 1px solid #000;
}
.product-size .size-options label:hover {
	box-shadow: 0 0 0 .125rem var(--pink);
}
.product-size .size-options label.checked {
	background-color: #000;
	color: #fff;
} 
.product-size .size-options label.out-of-stock {
	color: #999;
	border-color: #999;
}
.product-size .size-options label.out-of-stock:hover {
	box-shadow: 0 0 0 .125rem #ddd;
}
.product-size .size-options label.out-of-stock.checked {
	background-color: #999;
	color: #fff;
}
.product-size .size-options label .size { 
	display: flex;
	flex: 0 0 auto;
	margin: 0 auto 0 0;
	transition: .3s ease; 
	border: 0px solid #fff; 
	min-height: 24px; 
	min-width: 24px; 
	padding: .5em 1em; 
	justify-content: flex-start; 
	align-items: center; 
}
.product-size .size-options label .stock { 
	flex: 0 0 auto;
	margin: 0 0 0 auto;
	padding: .5em 1em; 
}
.product-size .size-options input[type="radio"]:checked+label .size,
.product-size .size-options input[type="radio"]:checked+label .stock { 
	background: #000; 
	color: #fff; 
	border-color: #000; 
}

.colour-options input[type='radio'],
.size-options input[type='radio'] { display: none; }


.size-guide {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 100000;
	background: rgba(0, 0, 0, .5);
	padding: 1rem;
}
.size-guide.active {
	display: flex;
	justify-content: center;
	align-items: center;
}
.size-guide.active {
	animation: modalBg .15s cubic-bezier(0.4, 0, 0.2, 1);
}
@keyframes modalBg {
	from {
		/* transform: scale(.9) translateY(1rem); */
		opacity: 0;
	}
	to {
		/* transform: scale(1) translateY(0); */
		opacity: 1;
	}
}
.size-guide .size-guide-inner {
	position: relative;
	max-width: 480px;
	background: #fff; 
	border: 1px solid #222;
	padding: 1.5rem;
}
.size-guide.active .size-guide-inner {
	animation: modalPop .15s cubic-bezier(0.4, 0, 0.2, 1);
}
@keyframes modalPop {
	from {
		transform: scale(.9) translateY(1rem);
		opacity: 0;
	}
	to {
		transform: scale(1) translateY(0);
		opacity: 1;
	}
}
.size-guide-toggle {
	display: block;
	font-size: var(--font-size-sm);
	/* text-transform: uppercase; */
	appearance: none;
	border: 0;
	background-color: transparent;
	cursor: pointer;
	text-decoration: underline;
	font-stretch: expanded;
}
.size-guide .size-guide-toggle {
	border: 0;
	background-color: transparent;
	cursor: pointer;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1;
	padding: 1rem;
	width: 4.5rem;
	height: 4.5rem;
	background-image: url(/img/xmark-large-solid.svg);
	background-size: 1rem;
	background-position: center;
	background-repeat: no-repeat;
}
.size-guide-toggle span {
	opacity: 0;
}
#main .size-guide h3 {
	text-transform: uppercase;
	font-size: var(--font-size-md);
	margin: 0 0 1em 0;
}
#main .size-guide p:last-child { 
	margin-bottom: 0; 
}
.size-guide table {
	border: 1px solid #ccc;
	margin: 1rem 0;
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
}
.size-guide table thead {
	text-align: center;
	font-weight: bold;
}
.size-guide table tbody {
	text-align: center;
	font-stretch: expanded;
}
.size-guide table th,
.size-guide table td {
	padding: .5em;
	border: 1px solid #ccc;
}

.product-custom-fields {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	text-transform: uppercase; 
	/* border: 1px solid var(--pink);  */
	background: var(--green);
	padding: 1rem 1rem .25rem 1rem;
}

.product-custom-field {
	flex: 0 0 100%;
	display: flex; 
	flex-wrap: wrap;
	gap: 0;
	margin: 0 0 1em 0;
}

.product-custom-fields.has-toggle .product-custom-field {
	display: none; 
}
.product-custom-fields.has-toggle .product-custom-field.customise,
.product-custom-fields.has-toggle.active .product-custom-field {
	display: flex; 
}

.product-custom-field .field-options-wrap {
	flex: 0 0 100%;
	margin-top: .25rem;
}

.product-custom-field .field-options {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.product-custom-field .field-options .field-option {
	flex: 0 0 auto;
}

.product-custom-field label {
	flex: 0 0 auto;
	background: #fff;
	border: 1px solid #000;
	line-height: 1;
	padding: .5em .75em; 
	cursor: pointer;
}

.product-custom-field-description {
	flex: 0 0 100%;
	font-family: Agipo, sans-serif;
	text-transform: none;
	font-stretch: expanded;
}

.product-custom-field input[type=text] {
	flex: 0 0 100%;
	border: 1px solid #000;
	padding: .5em 1em;
	text-transform: uppercase;
	margin-top: .25rem;
}

.product-custom-field input[type=radio],
.product-custom-field input[type=checkbox] {
	display: none;
}

.product-custom-field label:hover { 
	box-shadow: 0 0 0 .125rem var(--pink);
}
.product-custom-field label.checked {
	background-color: #000;
	color: #fff;
}


.add-to-bag-wrap {
	position: sticky; 
	top: 3rem;
}

.add-to-bag-button { 
	margin-top: 2rem; 
	display: flex;
	gap: .5rem;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
}


input.add-to-basket { width: 100%; cursor: pointer; border-radius: 0; text-transform: uppercase; display: inline-block; border: none; background-color: #212121; transition: .3s ease background; color: #fff; font-size: var(--font-size-md); line-height: 1; padding: .75em 0; text-align: center; font-weight: bold; margin: 0; }
input.add-to-basket:focus { outline: none; }
.quantity-ctrl { display: block; text-align: center; padding: .75em 0; margin: 0; border: 1px solid transparent }


#footer { 
	background: #fff; 
	padding: 3rem 1.5rem 6rem; 
	position: relative; 
	z-index: 1; 
	display: flex;
	flex-wrap: wrap;
}
@media (min-width:768px) {
	#footer {
		padding: 3rem 2.5rem 9rem;
	}
}
#footer-inner {
	flex: 0 0 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	gap: 0;
}
@media (min-width:1024px) {
	#footer-inner {
		gap: 0;
	}
}

.footer-socials {
	flex: 0 0 100%;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-start;
	padding: 1.5rem 0;
}

.footer-socials ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	gap: 1.5rem;
	align-items: center;
}
  
.footer-socials ul li a {
	display: block;
	width: 1.5rem;
	height: 1.5rem;
	object-fit: contain;
	object-position: center;
}
  
.footer-socials ul li a img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	/* filter: invert(1); */
}
  

#footer-contact {
	flex: 0 0 100%;
}
@media (min-width:1024px) {
	#footer-contact {
		flex: 0 0 25%;
	}
}
#footer p { 
	font-family: Agipo, sans-serif;
	font-weight: normal;
	font-stretch: expanded;
	font-size: var(--font-size-sm); 
	line-height: 1.5; 
	margin: 0 0 1em 0; 
	color: #222; 
	text-align: left; 
}
#footer a { 
	color: #222; 
}

#footer-nav { 
	flex: 0 0 100%;
}
@media (min-width:1024px) {
	#footer-nav {
		flex: 1 0 75%;
		display: flex;
	}
}
#footer-nav ul { 
	margin: 0 0 auto 0;
	padding: 0;
	flex: 0 0 100%;
	list-style: none; 
	font-weight: normal; 
	font-stretch: expanded;
	font-size: var(--font-size-sm);
	/* text-transform: uppercase; */
	line-height: 1.5; 
	text-align: left; 
	display: flex; 
	flex-wrap: wrap; 
	/* gap: .5em; */
}
@media (min-width:768px) {
	#footer-nav ul {
		flex: 1 0 calc(25%);
	}
}
#footer-nav ul li { 
	flex: 0 0 100%; 
	margin: 0;
	padding: 0;
}
#footer-nav a {
	text-decoration: none;
}

/* SHOP */
.message,
.errors { 
	margin: 1em 0; 
	background: var(--green); 
	padding: .5em; 
}
.errors {
	background: var(--pink);
}
#main .message ul,
#main .errors ul {
	list-style: none;
	margin: 0;
}
.checkout #main div.message h3 { color: #222; margin: 1em 0 0 0; font-size: var(--font-size-base); }
.checkout #main div.message h3:first-child { margin-top: 0; }
.checkout #main div.message p { color: #222; margin: 0; }
.basket #main .message p { margin: 0; text-align: center; }

body.basket #main,
body.checkout #main,
body.review #main,
body.terms #main {
	padding: 4rem 1.5rem;
}

@media (min-width:768px) {
	body.basket #main,
	body.checkout #main,
	body.review #main,
	body.terms #main {
		padding: 4rem 2.5rem;
	}
}

/* .basket-wrap { margin: 1rem 1rem 12rem 1rem; flex: 1 1 100%; }

@media screen and (min-width: 1024px) {
	.basket-wrap { margin: .75rem 2.5rem 12rem; }
} */

/* @media screen and (min-width: 1280px) {
	.basket-wrap { margin: 3rem 3rem 12rem; }
} */

.table-responsive { overflow: auto; }
.table { border-collapse: collapse; width: 100%; max-width: 100%; margin: 1em 0; }
.table thead { text-align: left; }
.table>thead>tr>th,
.table>tbody>tr>th,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>tbody>tr>td,
.table>tfoot>tr>td { padding: .5em; line-height: 1.25; vertical-align: top; border-top: 1px solid #b3b1a4; }

.table thead>tr>th { border-top: 0; }
.table thead>tr>th.price { width: 120px; }
.table span.ex-vat { font-size: var(--font-size-sm); color: #757575; line-height: 1.5; display: block; }

td.basket-thumb { width: 90px }
td.basket-options { width: 90px; }
table .text-right { text-align: right; }

body.shop table.table th,body.shop table.table td { border-color: #757575; }
.form-control { display: block; width: 100%; padding: .5em; color: #222; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 2px; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); box-shadow: inset 0 1px 1px rgba(0,0,0,.075); -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; }
textarea.form-control { height: auto; }

#main h2,
.basket #main h2,
.checkout #main h2,
.review #main h2,
.pay #main h2,
.thankyou #main h2 { 
	font-family: Correspondance; 
	font-weight: normal; 
	margin: 2em 0 1em 0; 
}

.basket #main p,
.checkout #main p,
.review #main p,
.pay #main p,
.thankyou #main p { margin: 0 0 1em 0; }

#main p.small { font-size: var(--font-size-sm); }
#main p.small a { color: #222 !important; text-decoration: underline !important;}

.form-group { margin-bottom: 1em; }
.form-group label { display: block; text-transform: uppercase; margin: .5em 0 .25em 0; }
.basket-thumb img { max-width: 90px; max-height: 90px; }
a.btn-checkout,
input.btn-checkout,
button.btn-checkout { text-decoration: none; display: block; width: 100%; transition: .3s; margin-bottom: 1em; border-radius: 0; text-transform: uppercase; font-size: var(--font-size-md); padding: .75em 1.5em; text-align: center; font-weight: bold; }
a.btn-checkout:hover { text-decoration: none; }

@media (min-width: 480px) { 
	a.btn-checkout,
	input.btn-checkout,
	button.btn-checkout { max-width: 20rem; }
}

#payment-form { margin-bottom: 1em; }
img.cards-accepted { height: 39.81px; position: relative; left: -7px; }
.payment-errors { font-weight: bold; margin-bottom: 1em; }

.vat-btn { border: none; background: none; padding: 0; }

.radios {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 1em 0;
}
.radio {
	flex: 0 0 100%;
	padding: 1em;
	border: 1px solid #ddd;
	cursor: pointer;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	gap: .5em;
}
.radio.selected {
	border-color: #222;
}
.radio span {
	flex: 0 0 5rem;
}
.radio span.method-cost,
.radio span.method-detail {
	font-stretch: expanded;
}
.radio span.method-cost {
	flex: 0 0 3rem;
}

@media (max-width: 767px) {
	.hide-on-mobile { display: none; }
}

@media (min-width: 768px) {
	.hide-on-desktop { display: none; }
}


/* LEGAL PAGE */

body.legal #main {
	padding: 4rem 1.5rem;
}

@media (min-width:768px) {
	body.legal #main {
		padding: 4rem 2.5rem;
		max-width: 48rem;
		font-size: var(--font-size-sm);
	}
}


/* PRIVACY PAGE */

body.privacy #main {
	padding: 4rem 1.5rem;
}

@media (min-width:768px) {
	body.privacy #main {
		padding: 4rem 2.5rem;
		max-width: 48rem;
		font-size: var(--font-size-sm);
	}
}

body.privacy table { margin: 30px 0; margin: 0 0 30px 0; border-collapse: collapse; }
body.privacy th { color: #222; font-size: var(--font-size-sm); line-height: 20px; text-align: left; font-weight: normal; vertical-align: top; padding: 12px 18px; border: 1px solid #ddd; }
body.privacy td { color: #222; font-size: var(--font-size-sm); line-height: 20px; vertical-align: top; padding: 18px; border: 1px solid #ddd; }


/* 
.collection-name { text-align: right; position: absolute; width: 50%; top: -8px; left: 0%; z-index: 1000; font-size: 60px; line-height: 60px; font-family: 'Correspondance', sans-serif; font-weight: normal; }
.collection-name .number { font-size: 45px; font-family: -apple-system, 'Arial Black', sans-serif; font-weight: 900; }
.collection-credits { margin-top: 18px; text-align: center; display: none; }
#main .collection-credits p { font-size: var(--font-size-sm); margin: 0 0 2em 0; }


@media screen and (min-width: 1200px) {
	.collection-name { left: -17.5%; }
}
*/

/* COLLECTION SLICK */

.collection-slides { 
	position: relative; 
	display: flex;
	flex-wrap: wrap;
}
.collection-slides .slide {
	flex: 0 0 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
	position: relative;
}
.collection-slides .slide .image {
	flex: 0 0 100%;
}
.collection-slides .slide img {
	display: block;
	width: 100%;
	height: auto;
}
.slide .slide-caption { 
	margin: 1rem 1.5rem; 
} 
@media (min-width:768px) {
	.slide .slide-caption { 
		margin: 1rem 3rem;
	}
}
.slide .slide-caption p { 
	font-size: var(--font-size-sm); 
	line-height: 1.25; 
	font-style: italic; 
	margin: 0 0 1em 0; 
}

.collection-credits { display: flex; flex-wrap: wrap; align-items: center; height: 100vh; }
#main .collection-credits p { flex: 0 0 100%; font-size: var(--font-size-sm); line-height: 1.25; text-align: center; font-style: italic; max-width: 32rem; margin: 0 auto; }






/* PRODUCT SLICK */

.slick-initialized .slick-slide.product-slide { display: flex; justify-content: center; }

.product-slide img,
.product-slide video { 
	width: 100%; 
	height: auto; 
	aspect-ratio: 2/3; 
	object-fit: cover; 
	object-position: center; 
	margin: 0; 
	transition: .2s opacity ease; 
}

.product-slide .img-span { position: relative; }
.product-slide .img-span .zoom { 
	opacity: 1; 
	content: ''; 
	width: 4rem; 
	height: 4rem; 
	transition: .3s all ease; 
	background: transparent; 
	position: absolute; 
	bottom: 0; 
	right: 0; 
	background-image: url('/img/magnifying-glass-plus-sharp-regular.svg'); 
	background-repeat: no-repeat; 
	background-size: 1.75rem 1.75rem; 
	background-position: center; 
}
.product-slide:hover .img-span .zoom { opacity: 1; }
.product-slide .img-span .zoom:hover { cursor: pointer; background-color: #fff; transition: .3s all ease; }
/*.product-slide img:hover { opacity: 0; cursor: zoom-in; }*/

.product-image .img-span { position: relative; }
.product-image .img-span .zoom { 
	opacity: 1; 
	content: ''; 
	width: 4rem; 
	height: 4rem; 
	transition: .3s all ease; 
	background: transparent; 
	position: absolute; 
	bottom: 0; 
	right: 0; 
	appearance: none;
	border: 0;
	background: none;
	background-image: url('/img/magnifying-glass-plus-sharp-regular.svg'); 
	background-repeat: no-repeat; 
	background-size: 1.75rem 1.75rem; 
	background-position: center; 
}
.product-image:hover .img-span .zoom { opacity: 1; }
.product-image .img-span .zoom:hover { cursor: pointer; background-color: #fff; transition: .3s all ease; }
/* .product-slide img:hover { opacity: 0; cursor: zoom-in; } */

@media (min-width:768px) {
	.product-image .img-span .zoom { opacity: 0; }
	.product-image:hover .img-span .zoom { opacity: 1; }
}

@media (min-width:1440px) {
	.product-slide img,
	.product-slide video { height: 36rem; margin: 0 auto; }
}

@media (min-width:1536px) {
	.product-slide img,
	.product-slide video { height: 48rem; margin: 0 auto; }
}

#main ul.slick-dots { 
	margin: 0; 
	display: flex;
	flex-wrap: wrap; 
	justify-content: center;
	align-items: center;
	gap: .25rem;
}
#main .slick-dots li { 
	margin: 0;
	flex: 0 0 auto;
	width: auto;
	height: auto;
}
#main .slick-dots li button { 
	width: .5rem; 
	height: .5rem; 
	padding: 0;
}
#main .slick-dots li button:before { 
	font-size: .5rem; 
	line-height: 1;
	width: .5rem;
	height: .5rem;
	display: flex;
	justify-content: center;
	align-items: center;
}
body.signup #main,
body.signin #main,
body.forgot-password #main,
body.reset-password #main { 
	min-height: 100vh; 
	display: flex; 
	flex-wrap: wrap; 
	justify-content: center; 
	align-items: center; 
}

.signin-form { flex: 0 0 100%; padding: 0 1.5rem 1.5rem }
@media (min-width: 480px) {
	.signin-form { flex: 0 0 480px; margin: auto; }
}

#signup-form .telephone {
	display: none;
}

.signin-form .btn { margin: 1em 0; }

.error-message-wrap { margin: auto; min-height: 100vh; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
.error-message-inner { flex: 0 0 100%; padding: 0 1.5rem 1.5rem; text-align: center; }
@media (min-width: 480px) {
	.error-message-inner { flex: 0 0 480px; }
}

/* PRODUCT ZOOM */
.zoomWrap { 
	position: fixed; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%; 
	overflow: hidden; 
	background: #fff; 
	z-index: -1; 
	display: flex; 
	justify-content: center; 
	transform: scale(.8) translateY(50%);
	opacity: 0;
	transition: .2s ease all;
}
.zoomWrap.active {
	transform: scale(1) translateY(0);
	z-index: 100000;
	opacity: 1;
	transition: .3s ease all;
}

.zoomClose { 
	border: 0; 
	background-color: transparent; 
	cursor: pointer; 
	position: absolute; 
	top: 0; 
	right: 0; 
	z-index: 1; 
	padding: 1rem; 
	width: 4rem; 
	height: 4rem; 
	background-image: url(/img/xmark-large-sharp-regular.svg); 
	background-size: 1.75rem; 
	background-position: center; 
	background-repeat: no-repeat; 
}
.zoomThumbs { position: absolute; z-index: 100; bottom: .5rem; right: .5rem; padding: 1rem; display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
.zoomThumbs img { height: 3rem; border: 3px solid transparent; cursor: pointer; }
.zoomThumbs img.active { border-color: var(--pink); }
.zoomImageWrap { width: 100vw; height: 100%; background-repeat: no-repeat; position: relative; }
img.zoomImage { display: block; object-fit: cover; width: 100%; height: 100%; flex: 0 0 auto; transition: .2s opacity ease-in; }

@media (min-width:768px) {
	.zoomWrap { height: 100%; }
	.zoomImageWrap { width: auto; height: 100%; }
	.zoomThumbs img { height: 4rem; }
	.zoomWrap::after { opacity: 1; transition: .3s opacity ease; padding: 1rem 2rem; background-image: url(/img/magnifying-glass-plus-sharp-regular.svg); background-position: .125rem 1.25rem; background-size: 1rem; min-width: 1rem; background-repeat: no-repeat; content: 'Hover to zoom'; font-size: var(--font-size-base); position: absolute; z-index: 1000; top: .25rem; left: 1.5rem; width: auto; text-align: center; }
	.zoomImageWrap.loaded::after { opacity: 1; }
	.zoomImageWrap.loaded:hover .zoomImage { opacity: 0; }
	.zoomImageWrap.loaded:hover::after { opacity: 0; }
}

/* HOME 2021 */

.homepage-wrap { 
	z-index: 0; 
	position: static; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100vh; 
	overflow: hidden; 
}

@media(min-width:768px) and (orientation:landscape) {
	.homepage-wrap { height: 100vh; }
}

.homepage-media { z-index: 0; position: absolute; top: 0; left: 0; width: 100vw; height: 100%; display: flex; justify-content: center; align-items: center; }
.homepage-media img { width: 100%; height: 100%; object-fit: cover; }
.homepage-media img.portrait { display: none; }

.homepage-media video { width: 100%; height: 100%; object-fit: cover; }

@media (orientation: portrait) {
	.homepage-media.has-portrait img.landscape { display: none; }
	.homepage-media.has-portrait img.portrait { display: block; object-fit: cover; }
}

.homepage-logo { z-index: 10; position: fixed; bottom: 0; left: 0; width: 100%; height: auto; padding: 1rem; }
@media (orientation: landscape) {
	.homepage-wrap.style-original .homepage-logo { padding: .5rem 2rem 1rem; }
	.homepage-wrap.style-stacked .homepage-logo { padding: .5rem 2rem; height: 100vw; top: calc(50vh - 49vw); }
}

.homepage-logo img { display: block; width: 100%; }

.homepage-wrap.style-original .homepage-logo { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: flex-end; }
.homepage-wrap.style-original .homepage-logo img:not(:nth-child(1)) { display: none; }
.homepage-wrap.style-original .homepage-logo img:nth-child(1) { flex: 0 0 100%; }

.homepage-wrap.style-stacked .homepage-logo { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
.homepage-wrap.style-stacked .homepage-logo img { flex: 0 0 100%; }

.homepage-wrap.style-overlap .homepage-logo { padding: 0 !important; }
.homepage-wrap.style-overlap .homepage-logo img { display: none; }
.homepage-wrap.style-overlap .homepage-logo img:nth-child(1) { display: block; position: absolute; top: -7vw; width: 100vw; }
.homepage-wrap.style-overlap .homepage-logo img:nth-child(2) { display: block; position: absolute; top: 42vh; right: -49vw; width: 100vw; transform: rotate(90deg); transform-origin: 50% 50% 0; }
.homepage-wrap.style-overlap .homepage-logo img:nth-child(3) { display: block; position: absolute; bottom: -7vw; width: 100vw; transform: rotate(180deg); transform-origin: 50% 50% 0; }
.homepage-wrap.style-overlap .homepage-logo img:nth-child(4) { display: block; position: absolute; top: 42vh; left: -49vw; width: 100vw; transform: rotate(270deg); transform-origin: 50% 50% 0; }

.homepage-wrap.style-stretch .homepage-logo { padding: 0 !important; }
.homepage-wrap.style-stretch .homepage-logo img { display: none; }

@media (max-width:479px) {
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(1),
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(2),
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(3),
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(4),
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(5),
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(6),
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(7),
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(8) { object-fit: contain; display: block; position: absolute; width: calc(100vw - 28vw); height: calc((100vw - 28vw)/7.14); }
	
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(1) { top: 1.5vw; left: 14vw; }
	
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(2) { top: calc(0vh - (100vw - 28vw)/2); left: 98vw; transform: rotate(90deg); transform-origin: top left; }
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(5) { top: calc(50vh - (100vw - 28vw)/2); left: 98vw; transform: rotate(90deg); transform-origin: top left; }
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(7) { top: calc(100vh - (100vw - 28vw)/2); left: 98vw; transform: rotate(90deg); transform-origin: top left; }
	
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(3) { bottom: 1.5vw; left: 14vw; }
	
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(4) { top: calc((100vw - 28vw) - (100vw - 28vw)/2); left: 1vw; transform: rotate(-90deg); transform-origin: top left; }
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(6) { top: calc(50vh + (100vw - 28vw) - (100vw - 28vw)/2); left: 1vw; transform: rotate(-90deg); transform-origin: top left; }
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(8) { top: calc(100vh + (100vw - 28vw) - (100vw - 28vw)/2); left: 1vw; transform: rotate(-90deg); transform-origin: top left; }
}

@media (min-width:480px) {
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(1) { object-fit: contain; display: block; position: absolute; top: 1.5vw; left: 14vh; width: calc(100vw - 28vh); height: calc((100vw - 28vh)/7.14); }
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(2) { object-fit: contain; display: block; position: absolute; top: 0; left: 99.25vw; width: 100vh; height: 15vh; transform: rotate(90deg); transform-origin: top left; }
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(3) { object-fit: contain; display: block; position: absolute; bottom: 1.5vw; left: 14vh; width: calc(100vw - 28vh); height: calc((100vw - 28vh)/7.14); }
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(4) { object-fit: contain; display: block; position: absolute; bottom: -15vh; left: .5vw; width: 100vh; height: 15vh; transform: rotate(-90deg); transform-origin: top left; }
}

@media (orientation: landscape) {
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(1) { top: 0; }
	.homepage-wrap.style-stretch .homepage-logo img:nth-child(3) { bottom: 0; }
}

.homepage-wrap.style-stamp .homepage-logo { padding: 0 !important; }
.homepage-wrap.style-stamp .homepage-logo img { display: none; }
.homepage-wrap.style-stamp .homepage-logo img:nth-child(1) { display: block; position: absolute; top: 10vh; left: -10vw; width: 85vw; transform: rotate(-30deg); transform-origin: center center; }
.homepage-wrap.style-stamp .homepage-logo img:nth-child(2) { display: block; position: absolute; top: 42vh; right: -10vw; width: 45vw; transform: rotate(5deg); transform-origin: top right 0; }
.homepage-wrap.style-stamp .homepage-logo img:nth-child(3) { display: block; position: absolute; bottom: -15vw; right: 30vw; width: 40vw; transform: rotate(80deg); transform-origin: top right 0; }
.homepage-wrap.style-stamp .homepage-logo img:nth-child(4) { display: block; position: absolute; bottom: 0vw; left: -40vw; width: 35vw; transform: rotate(170deg); transform-origin: top right 0; }

.homepage-wrap.style-lr .homepage-logo { padding: 0 !important; }
.homepage-wrap.style-lr .homepage-logo img { display: none; }

@media (max-width:479px) {
	.homepage-wrap.style-lr .homepage-logo img:nth-child(1),
	.homepage-wrap.style-lr .homepage-logo img:nth-child(2),
	.homepage-wrap.style-lr .homepage-logo img:nth-child(3),
	.homepage-wrap.style-lr .homepage-logo img:nth-child(4),
	.homepage-wrap.style-lr .homepage-logo img:nth-child(5),
	.homepage-wrap.style-lr .homepage-logo img:nth-child(6) { object-fit: contain; display: block; position: absolute; width: calc(100vw - 28vw); height: calc((100vw - 28vw)/7.14); }
	
	.homepage-wrap.style-lr .homepage-logo img:nth-child(1) { top: calc(0vh - (100vw - 28vw)/2); left: 98vw; transform: rotate(90deg); transform-origin: top left; }
	.homepage-wrap.style-lr .homepage-logo img:nth-child(2) { top: calc(50vh - (100vw - 28vw)/2); left: 98vw; transform: rotate(90deg); transform-origin: top left; }
	.homepage-wrap.style-lr .homepage-logo img:nth-child(3) { top: calc(100vh - (100vw - 28vw)/2); left: 98vw; transform: rotate(90deg); transform-origin: top left; }
	
	.homepage-wrap.style-lr .homepage-logo img:nth-child(4) { top: calc((100vw - 28vw) - (100vw - 28vw)/2); left: 1vw; transform: rotate(-90deg); transform-origin: top left; }
	.homepage-wrap.style-lr .homepage-logo img:nth-child(5) { top: calc(50vh + (100vw - 28vw) - (100vw - 28vw)/2); left: 1vw; transform: rotate(-90deg); transform-origin: top left; }
	.homepage-wrap.style-lr .homepage-logo img:nth-child(6) { top: calc(100vh + (100vw - 28vw) - (100vw - 28vw)/2); left: 1vw; transform: rotate(-90deg); transform-origin: top left; }
}

@media (min-width:480px) {
	.homepage-wrap.style-lr .homepage-logo img:nth-child(1) { object-fit: contain; display: block; position: absolute; top: 0; left: 99.25vw; width: 100vh; height: 15vh; transform: rotate(90deg); transform-origin: top left; }
	.homepage-wrap.style-lr .homepage-logo img:nth-child(2) { object-fit: contain; display: block; position: absolute; bottom: -15vh; left: .5vw; width: 100vh; height: 15vh; transform: rotate(-90deg); transform-origin: top left; }
}

@media (orientation: landscape) {
	.homepage-wrap.style-lr .homepage-logo img:nth-child(1) { top: 0; }
	.homepage-wrap.style-lr .homepage-logo img:nth-child(3) { bottom: 0; }
}


.homepage-title-wrap { z-index: 100; position: absolute; top: 0; left: 0; width: 100vw; height: 100vh; display: flex; justify-content: center; align-items: center; }
.homepage-title { flex: 0 0 auto; max-width: 100%; text-align: center; }
.homepage-title .homepage-title-headline { padding: .5rem; font-size: var(--font-size-md); line-height: 1; margin: 0; font-weight: bold; }
.homepage-title a { padding: .5rem; font-size: var(--font-size-base); line-height: 1; margin: 0; text-decoration: none; }

@media(max-width:767px) {
	.homepage-title.small .homepage-title-headline { font-size: var(--font-size-md); }
	.homepage-title.medium .homepage-title-headline { font-size: var(--font-size-lg); }
	.homepage-title.large .homepage-title-headline { font-size: 31.25px; }
}

@media(min-width:768px) {
	.homepage-title.small .homepage-title-headline { font-size: var(--font-size-lg); }
	.homepage-title.medium .homepage-title-headline { font-size: 39.06px; }
	.homepage-title.large .homepage-title-headline { font-size: 61.04px; }
}

@media(min-width:1024px) {
	.homepage-title.small .homepage-title-headline { font-size: 31.25px; }
	.homepage-title.medium .homepage-title-headline { font-size: 61.04px; }
	.homepage-title.large .homepage-title-headline { font-size: 95.37px; }
}

@media(min-width:1280px) {
	.homepage-title.small .homepage-title-headline { font-size: 39.06px; }
	.homepage-title.medium .homepage-title-headline { font-size: 76.29px; }
	.homepage-title.large .homepage-title-headline { font-size: 119.21px; }
}

.homepage-wrap.bgcolor-blue { background-color: #2200CA; }
.homepage-wrap.bgcolor-pink { background-color: #f0f; }
.homepage-wrap.bgcolor-green { background-color: #2AF92F; }
.homepage-wrap.bgcolor-red { background-color: #f00; }
.homepage-wrap.bgcolor-yellow { background-color: #ff0; }
.homepage-wrap.bgcolor-black { background-color: #000; }
.homepage-wrap.bgcolor-white { background-color: #fff; }

.homepage-wrap.text-color-blue .homepage-title,
.homepage-wrap.text-color-blue .homepage-title * { color: #2200CA; }
.homepage-wrap.text-color-pink .homepage-title,
.homepage-wrap.text-color-pink .homepage-title * { color: #f0f; }
.homepage-wrap.text-color-green .homepage-title,
.homepage-wrap.text-color-green .homepage-title * { color: #2AF92F; }
.homepage-wrap.text-color-red .homepage-title,
.homepage-wrap.text-color-red .homepage-title * { color: #f00; }
.homepage-wrap.text-color-yellow .homepage-title,
.homepage-wrap.text-color-yellow .homepage-title * { color: #ff0; }
.homepage-wrap.text-color-black .homepage-title,
.homepage-wrap.text-color-black .homepage-title * { color: #000; }
.homepage-wrap.text-color-white .homepage-title,
.homepage-wrap.text-color-white .homepage-title * { color: #fff; }

.homepage-wrap.text-bgcolor-blue .homepage-title * { background-color: #2200CA; }
.homepage-wrap.text-bgcolor-pink .homepage-title * { background-color: #f0f; }
.homepage-wrap.text-bgcolor-green .homepage-title * { background-color: #2AF92F; }
.homepage-wrap.text-bgcolor-red .homepage-title * { background-color: #f00; }
.homepage-wrap.text-bgcolor-yellow .homepage-title * { background-color: #ff0; }
.homepage-wrap.text-bgcolor-black .homepage-title * { background-color: #000; }
.homepage-wrap.text-bgcolor-white .homepage-title * { background-color: #fff; }

.hidden { display: none !important; }


#cookie-consent { max-width: 360px; position: fixed; z-index: 100000; bottom: 0; right: 0; margin: 18px; background: #fff; padding: 15px 18px 18px 18px; box-shadow: 0 0 3rem rgba(0,0,0,.1); font-size: var(--font-size-sm); line-height: 20px; color: #222222; opacity: 1; -webkit-transition: 1s all ease-in; -moz-transition: 1s all ease-in; -o-transition: 1s all ease-in; transition: 1s all ease-in; }
body.privacy #cookie-consent { display: none; }
#cookie-consent.fade { opacity: 0; bottom: -300px; }
#cookie-consent.hide { display: none; }
#cookie-consent a.btn-optin { display: inline-block; margin: 12px 6px 0 0; padding: 6px 18px; background: #0c0; color: #fff; border: 0; }
#cookie-consent a.btn-optout { display: inline-block; margin: 12px 6px 0 6px; padding: 6px 0; background: #fff; color: #757575; border: 0; }
#ga-optin.hide { display: none; }
#ga-optout.hide { display: none; }



.popups-wrap {
	position: fixed;
	z-index: 1000;
	bottom: 1rem;
	right: 1rem;
	width: calc(100% - 2rem);
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}
.popup {
	display: none;
	flex-wrap: wrap;
	background: var(--green);
	padding: 1rem;
	gap: 1rem;
	box-shadow: 1rem 1rem 1rem 0 rgba(0,0,0,.1);
	position: relative;
	flex: 0 0 100%;
}
.popup.active {
	display: flex;
}
.popup.mailing-list {
	background: #fff;
	gap: 0;
	order: 100;
	z-index: 10;
}
.popup-close {
	position: absolute; 
	top: .5rem;
	right: .5rem;
	width: 1.5rem;
	aspect-ratio: 1;
}
.popup-close img {
	display: block;
	object-fit: contain;
	object-position: center;
	width: 1.5rem;
	aspect-ratio: 1;
	filter: invert(7%) sepia(2%) saturate(26%) hue-rotate(322deg) brightness(100%) contrast(84%);
}
.popup .message {
	margin: 0;
	padding: 0;
}
.popup .message-title,
.popup .popup-title {
	margin-right: 1rem;
}
.popup .message-content,
.message .message-content {
	font-stretch: expanded;
}
.popup.mailing-list form p {
	font-stretch: expanded;
	font-size: var(--font-size-xs)
}
.popup.mailing-list .field-wrapper {
	display: flex; 
	flex-wrap: wrap;
	margin: .75rem 0 .5rem 0;
}
.popup.mailing-list .field-wrapper label {
	display: none;
}
.popup.mailing-list .field-wrapper input[type=email] {
	flex: 1 1 40%;
	border: 0;
	border-radius: 0;
	background: #eee;
	padding: .5em .5em;
}
.popup.mailing-list .field-wrapper input[type=submit] {
	flex: 0 1 auto;
	border: 0;
	border-radius: 0;
	background: var(--blue);
	color: #fff;
	padding: .5em .5em;
}
.popup.mailing-list .field-wrapper .invalid-error {
	flex: 1 1 100%;
}

@media (min-width:768px) {
	.popups-wrap {
		width: 20rem;
	}
}

.discount-form,
.voucher-form {
	margin: 0 0 4rem 0;
}

.discount-wrap,
.voucher-wrap {
	display: flex; 
	gap: .75rem;
}

.discount-wrap input[type=text],
.voucher-wrap input[type=text] {
	padding: .5rem;
}

.invalid-discount-code,
.invalid-voucher-code {
	font-style: italic; 
	padding: .75rem 0
}

.discount-code-applied,
.voucher-code-applied {
	font-style: italic; 
	padding: .75rem 0
}


.visually-hidden {
	border-width: 0 !important;
	clip: rect(1px, 1px, 1px, 1px) !important;
	height: 1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	white-space: nowrap !important;
	width: 1px !important;
}

.nowrap {
	white-space: nowrap;
}

#main h2 {
	font-size: var(--font-size-lg);
	line-height: 1.25;
	margin: 1em 0 .5em 0;
}

table.shipping {
	table-layout: fixed;
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #ddd;
	margin: 1.5em 0;
}
table.shipping th {
	padding: .5em;
	border: 1px solid #ddd;
	text-align: left;
}
table.shipping td {
	padding: .5em;
	border: 1px solid #ddd;
	font-stretch: expanded;
}


/* WISHLIST */

body.wishlist #main {
	padding-top: 3rem;
	padding-bottom: 3rem;
}

.wishlist-actions { 
	flex: 0 0 100%;
	padding: 1rem 1rem 0;
}
#main .wishlist-actions p { 
	margin: 0 0 .5rem 0;
}
.wishlist-actions button {
	appearance: none;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
	text-decoration: underline;
	color: var(--blue);
}

body.wishlist .grid-products-wrap {
	padding-top: 0;
}

body.wishlist .grid-product {
	position: relative;
}

button.wishlist-toggle {
	cursor: pointer;
	appearance: none;
	border: 0;
	width: 2.5rem;
	aspect-ratio: 1;
	height: auto;
	font-size: var(--font-size-sm);
	background: transparent;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: .5rem;
	color: #222;
}

.grid-product button.wishlist-toggle {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 10;
}
.grid-product:hover button.wishlist-toggle {
	z-index: 30;
}

.wishlist-toggle img {
	width: 1rem;
	height: 1rem;
	filter: invert(0%) sepia(28%) saturate(156%) hue-rotate(316deg) brightness(99%) contrast(73%);
}

.wishlist-toggle span {
	display: none;
}
.wishlist-toggle-wrap .wishlist-toggle span {
	display: block;
	text-transform: uppercase;
}

/* WISHLIST ON PRODUCT PAGE */

.wishlist-toggle-wrap {
	flex: 0 0 100%;
	background: #fff;
	border: 1px solid #000;
}
.wishlist-toggle-wrap button.wishlist-toggle {
	width: 100%;
	height: 3rem;
}


.panels {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	gap: 0;
	padding: 0 0 0 0;
	background: #fff;
	z-index: 10;
}
.panel {
	flex: 1 0 calc(50% - .25rem);
	aspect-ratio: 2/3;
	width: 100%;
	height: auto;
	/* max-height: 100vh; */
	position: relative;
}
/* @media (min-width: 1024px) {
	.panel {
		flex: 1 0 calc(33.33% - .333rem);
	}
} */
.panel.format-landscape {
	aspect-ratio: 16/9;
}
.panel.size-1 {
	flex: 0 0 100%;
}
.panel .panel-media {
	display: block;
	aspect-ratio: 2/3;
	height: auto;
	width: 100%;
	/* max-height: 100vh; */
}
.panel.format-landscape .panel-media {
	aspect-ratio: 16/9;
}
.panel .panel-media img {
	display: block;
	object-fit: cover;
	object-position: center;
	width: 100%;
	height: 100%;
}
.panel .panel-media video {
	display: block;
	object-fit: cover;
	object-position: center;
	width: 100%;
	height: 100%;
}
.panel .panel-content {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 1rem 1rem;
	display: flex;
	justify-content: flex-start;
	align-items: flex-end;
}
.panel .panel-content .panel-title {
	font-weight: normal; 
	font-family: Correspondance, sans-serif; 
	line-height: 1; 
	text-transform: uppercase; 
	gap: 1.5rem; 
	text-align: center; 
	font-size: var(--font-size-body);
}

.panel:nth-child(1) .panel-content .panel-title,
.panel:nth-child(4) .panel-content .panel-title,
.panel:nth-child(5) .panel-content .panel-title {
	color: #fff;
}

@media (min-width: 768px) {
	.panel .panel-content { 
		align-items: flex-start;
	}
	.panel .panel-content .panel-title {
		font-size: var(--font-size-md);
	}
}
.panel a {
	text-decoration: none;
}
.panel a:hover {
	cursor: pointer;
}
/* .panel a:hover .panel-content .panel-title {
	color: #fff;
} */




.maker-wrap { 
	flex: 0 0 100%;
	text-align: left; 
	margin: 6rem auto 3rem; 
	display: flex;
	flex-wrap: wrap; 
	justify-content: flex-start;
}
#main .maker-wrap h2 { 
	flex: 1 0 auto; 
	margin: 0 1.5rem 1.5rem 1.5rem;
	font-size: var(--font-size-lg); 
	font-family: Correspondance;
	text-transform: uppercase;
	font-weight: normal; 
}
@media (min-width:768px) {
	#main .maker-wrap h2 {
		flex: 1 0 100%;
		margin: 0 2.5rem 1.5rem 2.5rem;
	}
}
.maker-wrap .maker-info {
	flex: 0 0 100%;
	padding: 1.5rem 1.5rem;
	font-size: var(--font-size-sm);
}

.maker-wrap .grid-images-wrap {
	flex: 0 0 100%;
}

.maker-wrap .grid-images { 
	display: flex; 
	flex-wrap: wrap;
	gap: 0;
	padding: 0 1.5rem;
}
.maker-wrap .grid-images    .grid-image {
	flex: 0 0 50%;
	position: relative;
}
#main .maker-info-inner h3 {
	font-size: var(--font-size-md);
	line-height: 1.25;
	margin: 0 0 1em 0;
	color: #222;
}

@media screen and (min-width: 1024px) {

	.maker-wrap {
		height: auto;
	}

	#main .maker-wrap h2 { 
		flex: 1 0 90%;
	}
	.maker-wrap .maker-info {
		flex: 0 0 33.33%;
		height: auto;
	}
	.maker-wrap .maker-info-inner {
		position: sticky;
		top: 6rem;
	}
	/* .maker-wrap { 
		margin: 3.5rem auto 0rem; 
	} */
	.maker-wrap .grid-images-wrap { 
		flex: 0 0 calc(66.67%); 
		height: 100%;
	}
	.maker-wrap .grid-images { 
		margin: 1.5rem 0 0 0; 
		padding: 0; 
		/* position: sticky;
		top: 4.5rem; */
	}
	.maker-wrap .grid-images .grid-image {
		/* flex: 0 0 calc(25% - .375rem); */
	}
	.maker-wrap .maker-info { 
		flex: 0 0 33.3%; 
		margin: 0 0 0 0; 
		padding-left: 2rem; 
		padding-right: 2rem;
	}

	#main .maker-info-inner h3 {
		/* font-size: var(--font-size-md);
		margin: 0 0 .5rem 0; */
	}
	
}

.regions-list {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	padding: 4rem 1.5rem;
}
.regions-list .region {
	flex: 0 0 100%;
}
.stockists-list {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	padding: 0;
}
.stockists-list .stockist {
	flex: 0 0 100%;
	font-size: var(--font-size-sm);
}

@media (min-width:768px) {
	.regions-list {
		padding: 4rem 2.5rem;
	}
	.regions-list .region {

	}
	.stockists-list .stockist {
		flex: 0 0 calc(50% - .5rem);
	}
}
@media (min-width: 1280px) {
	.stockists-list .stockist {
		flex: 0 0 calc(33.33% - .75rem);
	}
}


body.shipping-returns #main {
	padding: 4rem 1.5rem;
}

@media (min-width:768px) {
	body.shipping-returns #main {
		padding: 4rem 2.5rem;
		max-width: 48rem;
		font-size: var(--font-size-sm);
	}
}



body.contact #main {
	padding: 4rem 1.5rem;
}

@media (min-width:768px) {
	body.contact #main {
		padding: 4rem 2.5rem;
		/* max-width: 48rem; */
		font-size: var(--font-size-sm);
		display: flex; 
	}

	body.contact #main .contact-info {
		flex: 0 0 50%;
	}
}




body.about #main {
	display: flex;
	flex-wrap: wrap;
}
body.about .about-pic { 
	flex: 0 0 100%;
	margin: 0; 
}
body.about .about-content {
	flex: 0 0 100%;
	padding: 1.5rem;
	font-size: var(--font-size-sm);
}
@media (min-width:768px) {
	body.about .about-pic { 
		flex: 0 0 50%; 
		margin: 0; 
	}
	body.about .about-content {
		flex: 0 0 50%; 
		display: flex;
		align-items: center;
		padding: 1.5rem 7.5rem 1.5rem 2.5rem; 
	}
}
body.about .about-pic img { 
	display: block;
	aspect-ratio: 2/3;
	width: 100%;
	height: auto;
	object-fit: cover;
	object-position: center;
}
@media (min-width:1024px) {
	body.about .about-pic img { 
		aspect-ratio: 9/10;
	}
}
#main .about-pic .credit { 
	color: #222; 
	font-style: italic; 
	text-align: left; 
	font-size: var(--font-size-sm); 
	padding: .5rem 1.5rem 0; 
}

@media (min-width:768px) {
	#main .about-pic .credit { 
		padding: .5rem 2.5rem 0;
	}
}





body.news #main,
body.artists #main,
body.makers #main,
body.press #main,
body.atelier #main {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.news-list {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem 1.5rem;
	padding: 1.5rem;
	justify-content: center;
}
.news-list a {
	text-decoration: none;
}
@media (min-width:768px) {
	.news-list {
		gap: 2.5rem;
		padding: 2.25rem 2.5rem;
	}
}
/* 
.press .news-list {
	padding: 0;
} */


.news-wrap {
	flex: 0 0 100%;
}
@media (min-width:768px) {
	.news-wrap {
		flex: 0 0 calc(50% - 1.25rem);
	}
}
@media (min-width:1280px) {
	.news-wrap {
		flex: 0 0 calc(33.33% - 2rem);
	}
}

.publish-date { 
	font-size: var(--font-size-sm); 
	font-style: italic;
	margin: 0 0 1em 0; 
	text-align: center; 
}

.news-wrap img { 
	margin: 0 auto; 
	display: block; 
	width: 100%;
	height: auto; 
	aspect-ratio: 3/2;
	object-fit: contain;
	object-position: center;
}
#main .news-wrap h2 { 
	font-family: Correspondance; 
	font-weight: normal; 
	text-align: center; 
	font-size: var(--font-size-lg); 
	line-height: 1; 
	margin: .5em 0 0 0; 
	text-transform: uppercase; 
}
.news-wrap .news-source { 
	font-family: Correspondance; 
	font-weight: normal; 
	text-align: center; 
	font-size: var(--font-size-lg); 
	line-height: 1; 
	margin: 0 0 .25em 0; 
	text-transform: uppercase; 
}
.news-wrap .news-more { 
	font-size: var(--font-size-sm); 
	line-height: 1.5; 
	margin: .5em 0 0 0; 
	text-align: center; 
	text-transform: uppercase; 
}

.news-announcement-wrap { margin: 0 0 48px; }
.news-announcement-wrap a:not(:first-child) h2.news-announcement { margin-top: 18px; }
#main h2.news-announcement { font-family: Correspondance !important; font-weight: normal; text-align: center; font-size: 45px; line-height: 48px; text-transform: uppercase; }

body.home .news-announcement-wrap { position: absolute; bottom: 12px; margin: 0; width: 100%; }

body.c1-pink .news-source,
body.c1-pink .news-announcement { color: var(--pink); }
body.c1-blue .news-source,
body.c1-blue .news-announcement { color: var(--blue); }
body.c1-green .news-source,
body.c1-green .news-announcement { color: var(--green); }

@media screen and (min-width: 768px) {
	/* .news-wrap { margin: 0 0 4rem 0; }
	.news-wrap .news-inner img { width: auto; height: 20rem; margin: 1rem auto; }
	
	.publish-date { font-size: var(--font-size-sm); line-height: 1.5; margin: .5em 0 2.5em 0; text-align: center; }
	.news-wrap .publish-date { margin: 0; } */

	#main h2.news-announcement { font-size: 68px; line-height: 60px; }
	
	body.home .news-announcement-wrap { bottom: 50%; }
}







.news-pic { 
	flex: 0 0 100%;
	margin: 0; 
}
.news-content {
	flex: 0 0 100%;
	padding: 0 1.5rem;
	font-size: var(--font-size-sm);
}
@media (min-width:768px) {
	.news-pic { 
		flex: 0 0 100%; 
		margin: 2.25rem auto 0; 
	}
	.news-content {
		flex: 0 0 50%; 
		margin: 0 auto;
		display: flex;
		align-items: center;
		padding: 0 2.5rem; 
	}
}
.news-pic img { 
	display: block;
	width: 100%;
	margin: auto;
	height: auto;
}
@media (min-width:1024px) {
	.news-pic img { 
		max-width: 48rem;
	}
}
#main .news-pic .credit { 
	color: #222; 
	font-style: italic; 
	text-align: center; 
	font-size: var(--font-size-sm); 
	padding: .5rem 1.5rem 0; 
}

@media (min-width:768px) {
	#main .news-pic .credit { 
		padding: .5rem 2.5rem 0;
	}
}