:root {
	/*navbarheight for cover image height */
	--nav-height: 5rem;
	/*background color*/
	--background-color: white;
	/*primary color*/
	--primary-color: #333; /*444*/
	/*reset bootstrap default color*/
	--bs-body-color: var(--primary-color);
	/*hover color*/
	--hover-color: #777;
	--hover-color-block: #4d4d4d;
	--hover-color-light: #eee;
	/*negative color*/
	--primary-color-negative: white;
	/*accent color*/
	--accent-color: rosybrown;
	--accent-color-dim: dimgray;
	--accent-color-light: #ddd;
	--accent-color-text: white;
	--accent-color-light-text: var(--primary-color);
	--border-color: #dee2e6;
	--button-color-muted: #aaa;
	--sans: 'Yantramanav', sans-serif;
	/*--base-letter-spacing: ;*/
	/*--base-font-size: ;*/
	--site-width: 1920px;
}

/*
xs = Extra small <576px. Max container width None (auto)
sm = Small ≥576px. Max container width 540px.
md = Medium ≥768px. Max container width 720px.
lg = Large ≥992px. Max container width 960px.
xl = Extra large ≥1200px. Max container width 1140px.
xxl = Extra extra large ≥1400px.
*/

div {
	max-height: 999999px !important;  /*stop android chrome resizing text*/
	text-size-adjust: none !important;  /*same, but doesn't appear to work*/
}

html {
	font-size: calc(.91rem + 0.2vw);
}

body {
	font-family: var(--sans);
	font-weight: 300;
	line-height: 1.5;
	background-color: var(--background-color);
}

@media (min-width: 576px) {
	main {
		padding-top: 1rem;
		padding-bottom: 1.5vw;
	}
	main.no-page-padding {
		padding-top: 0;
		padding-bottom: 0;
	}
}

@media (min-width: 992px) {
	.container-fluid {
		max-width: var(--site-width);
	}
	main {
		padding-top: 1rem;
		padding-bottom: 2rem;
	}
	main.no-page-padding {
		padding-top: 0;
		padding-bottom: 0;
	}
}

@media (min-width: 1400px) {
	main {
		padding-bottom: 3rem;
	}
	main.no-page-padding {
		padding-top: 0;
		padding-bottom: 0;
	}
}

/*
==========================================================================
IMAGE SHARPENING
==========================================================================
*/

/* Sharpen rescaled images chrome/edge/firefox */
body {
	image-rendering: -webkit-optimize-contrast;
}

/* Sharpen rescaled images Safari 7.1+*/
_::-webkit-full-page-media,
_:future,
:root body {
	image-rendering: auto;
}

/*
==========================================================================
BOOTSTRAP GUTTERS: VARIABLE, WIDER ON BIG SCREENS
==========================================================================
*/

@media (min-width: 576px) {
	.gx-sm-5 {
		--bs-gutter-x: max(4vw, 3rem);
	}
	.px-sm-5 {
		padding-right: max(4vw, 3rem) !important;
		padding-left: max(4vw, 3rem) !important;
	}
	.mx-sm-4 {
		margin-right: max(4vw, 3rem) !important;
		margin-left: max(4vw, 3rem) !important;
	}
	.gy-sm-5 {
		--bs-gutter-y: max(4vw, 3rem);
	}
}

/*
==========================================================================
TYPOGRAPHY
==========================================================================
*/

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
	font-weight: 500;
}

h3,
h4,
h5,
h6,
.h3,
.h4,
.h5,
.h6 {

}

.lead p {

}

.h1, h1 {
	font-size: 2.2rem; /* min(calc(1.3rem + 2.9vw), 66.74px) */
	line-height: 1;
}

.h2, h2 {
	font-size: 2.2rem; /* min(calc(1.2rem + 1.6vw), 46.74px) */
	font-weight: 200;
}

.h3, h3 {
	font-size: 1.4rem;
	letter-spacing: 0.02rem;
}

.h4, h4 {
	font-size: 1.2rem;
	letter-spacing: 0.02rem;
}

p,
ul {
	font-size: 1.2rem;
}

p {
	font-size: 1.2rem;
}

p {
	/* Prevent Share page URL from going off screen on phones */
	word-break: break-word;
}

/* Text highlight color */
::selection {
	background: var(--accent-color); /* WebKit/Blink Browsers */
	color: var(--accent-color-text);;
}

/* Text: small style (dropdown) */
small {
	font-size: 83.3335%;
}

/* Text: footnotes (numbered lists) */
ol {
	font-size: 1.1rem;
}

/*
==========================================================================
HELPERS
==========================================================================
*/
.weight-200 {
	font-weight: 200;
}

.weight-300 {
	font-weight: 300;
}

.weight-400 {
	font-weight: 400;
}

.weight-500 {
	font-weight: 500;
}

.small {
	font-size: 75%;
}

.no-margin-bottom {
	margin-bottom: 0;
}

/*
==========================================================================
LINKS
==========================================================================
*/

a, a:link {
	color: var(--primary-color);
}

a:visited {
	color: var(--primary-color);
}

a:hover {
	color: var(--hover-color);
	text-decoration: none;
}

a:active {
	color: var(--primary-color);
}

/* Remove underlines prior to hovering */
a {
	text-decoration: none !important;
}

/*
========================================
Rich text links
========================================
*/

.rich-text a {
	/*text-decoration: underline !important;*/
	border-bottom: dotted 1px var(--primary-color);
}

.rich-text p,
.rich-text ul {
	font-family: 'Yantramanav', sans-serif;
}

/*
==========================================================================
LOGO
==========================================================================
*/

a.navbar-brand img {
	width: 7.5rem;
	transition: color .2s;
	/* Make rescaled logo smoother */
	image-rendering: auto;
}

/* Smaller logo on small phones */
@media (max-width: 350px) {
	a.navbar-brand p {
		font-size: 0.9rem;
	}
}

a.navbar-brand img:hover {
	filter:brightness(120%);
}

/*
==========================================================================
NAVBAR
==========================================================================
*/

.navbar {
	z-index: 100;
}

/* Align nav items with logo */
.navbar-nav {
	padding-top: 1.2rem;
}

.nav-item {
	font-size: 1.2rem;
	font-weight: 300;
	letter-spacing: 0.01rem;
}

/* Remove right-padding from last text link to reduce gap to search icon */
.navbar-light .nav-item:nth-last-child(4) a {
	padding-right: 0px !important;
}

/* When using .fixed-top navbar class so that 100vh works on cover image, change background to white unless you want transparent */
.navbar-expand-lg {
	background: white;
}

/* Color */
.navbar-light .navbar-nav .nav-link {
	color: var(--primary-color-light);
	transition: color .2s;
}

/* Hover color */
.nav-link:focus,
.nav-link:hover {
	color: var(--hover-color) !important;
}

/* Visited link color */
.nav-link:visited,
a.dropdown-item:visited {
	color: var(--primary-color);
}

/* Visited link color */
a.dropdown-item:visited:focus,
a.dropdown-item:visited:hover {
	color: var(--primary-color);
}

/* Remove vertical space between items when wraps onto two rows */
.nav-item a {
	padding-top: 0.3rem;
	padding-bottom: 0.3rem;
}

/* Horizontal spacing on desktop */
@media (min-width: 992px) {
	.navbar-expand-lg .navbar-nav .nav-link {
		padding-right: 1rem;
		padding-left: 1rem;
	}
}

.nav-item.active a.nav-link {
	/*color: deeppink !important;*/
	font-weight: 500;
}

/*
========================================
Nav search
========================================
*/

/* Stop home page slideshow text showing above phone navbar search field */
.search {
	background: white;
	z-index: 100;
}

.search .input-group-text {
	padding-left: 0;
	padding-right: 0;
	background: none;
	border: none;
}

/*
========================================
Navbar hamburger icon
========================================
*/

/* Phone hamburger icon three horizontal lines */
.navbar-toggler-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='black' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !important;
}

.navbar-toggler {
	border: none;
	/* ensure min 48 x 48px */
	padding: 8px;
	/* right-align with grid */
	margin-right: -12px;
	/*remove rounded corners*/
	border-radius: 0px;
	margin-top: 1.05rem;
}

/* Remove outline on click */
.navbar-light .navbar-toggler {
	color: white;
	border: none;
}

/*
==========================================================================
BUTTONS
==========================================================================
*/

.btn {
	font-weight: 300;
	padding-top: .4rem;
	padding-bottom: .4rem;
	padding-left: .65rem;
	padding-right: .65rem;
}

.btn a, .btn a:link, .btn-primary:link, .btn-primary:visited {
	color: var(--primary-color-negative);
}
.btn a:visited {
	color: var(--primary-color-negative);
}
.btn a:hover {
	color: var(--primary-color-negative);
}
.btn a:active {
	color: var(--primary-color-negative);
}

.btn-primary,
.btn-secondary,
.btn-outline-secondary {
	text-align: left;
	letter-spacing: 0.02rem;
}

.btn-primary,
.btn-secondary,
.btn-outline-secondary {
	border-radius: 0;
}

.btn-primary {
	background-color: var(--primary-color);
	border: none;
	border-color: var(--primary-color);
}

.btn-primary:hover,
.btn-primary:hover:active {
	border: none;
	color: white;
	background-color: var(--hover-color-block) !important;
}

.btn-secondary {
	background-color: white !important;
	border: none;
	color: var(--primary-color);
}

.btn-secondary:hover,
.btn-secondary:hover:active {
	background-color: white !important;
	border: none;
	color: var(--primary-color);
	color: var(--hover-color-block) !important;
}

.btn-outline-secondary {
	border: solid 1px #aaa;
	background: none;
	color: var(--primary-color);
	font-weight: 300;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:hover:active {
	background-color: var(--hover-color-light);
	border: solid 1px #aaa;
	color: var(--primary-color);
}

/* Color on click */
.btn-primary.focus,
.btn-primary:focus {
	color: white !important;
	background-color: var(--primary-color);
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
	color: white !important;
	background-color: var(--primary-color) !important;
}

/* Font color on click */
.btn-secondary.focus,
.btn-secondary:focus {
	color: var(--primary-color) !important;
}

/* Visited font color */
.btn-primary:visited {
	color: white !important;
}

/* Remove grey/blue outline on click */
.btn.focus,
.btn:focus {
	box-shadow: none !important;
}

.btn-lg {
	font-size: 1.6rem;
	line-height: 1.3;
	padding: 1.5rem;
	width: 100%;
	text-align: left;
}

@media (min-width: 0px) {
	/* Make buttons equal width */
	.btn-group-vertical a, .btn-group-vertical .btn, .btn-group-vertical .btn-group {
		width: 100%;
	}
}

.btn-group-vertical div {
	display: inline-block;
}

.btn-group-vertical small {
	color: var(--button-color-muted);
}

/*
==========================================================================
HOME PAGE
==========================================================================
*/

/*
========================================
Carousel
========================================
*/

/* Set height of foreground image, and therefore of carousel and images */

/* Home page carousel height */
@media (max-width: 575px) {
:root {
	--slider-height: calc(100dvh - 7.1rem);
		}
	}
@media (min-width: 576px) {
:root {
	--slider-height: calc(100dvh - 8.1rem);
		}
	}

.carousel.carousel-cover img {
	height: var(--slider-height);
	width: 100vw;
}
.carousel.carousel-cover img {
	object-fit: cover;
}

/*
========================================
Swiper
========================================
*/

/* Overide default height to account for dynamic top bar on phones */
.swiper-wrapper, .swiper-slide {
	/*height: 100svh;*/
}
.swiper-fade .swiper-slide {
	transition-duration: .8s !important;
}
.swiper-button-next:after, .swiper-button-prev:after {
	font-family: var(--font-sans);
}
.swiper-button-next:after {
	content: '›';
}
.swiper-button-prev:after {
	content: '‹';
}
.swiper-button-next, .swiper-button-prev {
	color: var(--primary-color);
}
.swiper-button-next:hover, .swiper-button-prev:hover {
	color: var(--hover-color);
}
.swiper-button-next {
	right: 0;
}
.swiper-button-prev {
	left: 0;
}
.swiper-button-next:after, .swiper-button-prev:after {
	/* Copied from splide */
	background: rgba(255, 255, 255, 0.50);
	border-radius:0% !important;
	height: 2em !important;
	opacity:0.7 !important;
	opacity:1 !important;
	width: 2em !important;
	/* Added, unique to swiper.js, to make it match splide */
	height: 2rem !important;
	line-height: .7;
	padding: 0 0.55rem;
	font-weight: 500;
}
.swiper-button-next:hover:after, .swiper-button-prev:hover:after {
	/* Copied from splide */
	opacity: .9 !important;
	background: white !important;
}
.swiper-button-next, .swiper-button-prev {
	top: 15%;
	height: 80%;
	padding-left: 44px;
	padding-right: 44px;
}
@media (min-width: 576px) {
	.swiper-button-next, .swiper-button-prev {
		padding-left: 68px;
		padding-right: 68px;
	}
}
@media (min-width: 992px) {
	.swiper-button-next, .swiper-button-prev {
		padding-left:  calc(calc(max(4vw, 3rem)*.5) + 1.5rem + 28px);
		padding-right: calc(calc(max(4vw, 3rem)*.5) + 1.5rem + 28px);
	}
}
@media (min-width: 1400px) {
	.swiper-button-next, .swiper-button-prev {
		padding-left: calc(calc(max(4vw, 3rem)*.5) + 3rem + 28px);
		padding-right: calc(calc(max(4vw, 3rem)*.5) + 3rem + 28px);
	}
}
.swiper-button-next:focus, .swiper-button-next:focus {
	/* Blue focus outline on Safari */
	outline: none;
}

/*
========================================
Gradient
========================================
*/

/* Gradient div is sibling to slider img element */
.gradient {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.4) 0.0%, rgba(0, 0, 0, 0.0) 55%);
	height: var(--slider-height);
	width: 100vw;
	position: absolute;
	top: 0;
	left: 0;
}

/*
========================================
Cover Text
========================================
*/

.cover-text {
	color: white;
	text-align: left !important;
	position: absolute;
	font-weight: 300;
	z-index: 1;
	letter-spacing: 0.03rem;
	font-size: 1.2rem;
	bottom: 2.2rem;
	left: 1.75rem;
}

.cover-text h1 {
	font-weight: 400;
	letter-spacing: -0.04rem;
}

.cover-text .h2 {
	font-weight: 200;
}

.cover-text a {
	color: white;
}

.cover-text a:visited {
	color: white;
}

.cover-text a:hover {
	color: white;
}

.cover-text a:active {
	color: white;
}


@media (min-width: 575px) and (max-width: 991px) {
	.cover-text {
		left: 3.2rem;
	}
}
@media (min-width: 992px) and (max-width: 1399px) {
	.cover-text {
		left: 3.7rem;
	}
}
@media (min-width: 1400px) and (max-width: 1919px) {
	.cover-text {
		left: calc(3.7rem + 2vw);
	}
}

.cover-text {
	--width: 100vw;
}

@media (min-width: 1920px) {
	.cover-text {
		left: calc(calc(calc(var(--width) - 1760px) /2) + 1.4vw);
	}
}

/*
========================================
Cover Caption
========================================
*/

.cover-caption {
	color: white;
	z-index: 1;
	letter-spacing: 0.03rem;
	font-size: 1.0rem;
	font-weight: 200;
}

/*
==========================================================================
BOOTSTRAP ICONS
==========================================================================
*/

/* WORK PAGE BUY NOW ICON */

.cart-svg {
	filter: invert();
	margin-bottom: 4px;
	margin-left: 4px;
}

/*SOLD RED DOT*/

.circle-fill {
	height: 12px;
	width: 12px;
	filter: invert(79%) sepia(7%) saturate(1739%) hue-rotate(314deg) brightness(82%) contrast(74%);
}

/*SEARCH*/

.search-svg {
	height: 48px;
	width: 48px;
	/*we want a min 48px square for lighthouse*/
	padding-left: 0px;
	/*no padding*/
	padding-right: 34px;
	/*so double padding here to compensate*/
	padding-top: 16px;
	/*padding - dimns = real size*/
	padding-bottom: 18px;
	/*padding - dimns = real size*/
	margin-top: -.15rem;
}

@media (min-width: 992px) {
	.search-svg {
		height: 48px;
		width: 48px;
		/*we want a min 48px square for lighthouse*/
		padding-left: 22px;
		/*no padding*/
		padding-right: 0px;
		/*so double padding here to compensate*/
		padding-top: 16px;
		/*padding - dimns = real size*/
		padding-bottom: 18px;
		/*padding - dimns = real size*/
		margin-right: -6px;
	}
}

.search-svg:hover {
	filter: contrast(30%); /*50% close to #444*/
	transition: filter .2s;
}

/*SHARE*/

.share-svg {
	/*we want a min 48px square for lighthouse*/
	padding-left: 0px;
	/*no padding*/
	padding-right: 24px;
	/*so double padding here to compensate*/
	padding-top: 8px;
	/*padding - dimns = real size*/
	padding-bottom: 8px;
	/*padding - dimns = real size*/
}


.share-page-svgs {
	height: 48px;
	width: 48px;
	/*we want a min 48px square for lighthouse*/
	padding-left: 0px;
	/*no padding*/
	padding-right: 16px;
	/*so double padding here to compensate*/
	padding-top: 8px;
	/*padding - dimns = real size*/
	padding-bottom: 8px;
	/*padding - dimns = real size*/
}

/*SOCIAL*/

.facebook-svg,
.twitter-x-svg,
.pinterest-svg,
.instagram-svg,
.share-svg,
.email-svg,
.telephone-svg {
	filter: contrast(60%); /*50% close to #444*/
	transition: filter .2s;
}

.facebook-svg:hover,
.twitter-x-svg:hover,
.pinterest-svg:hover,
.instagram-svg:hover,
.share-svg:hover {
	filter: contrast(30%);
}

.newtab-svg,
.pdf-svg {
	height: .8rem;
	width: .8rem;
	margin-left: 0.2rem;
	margin-top: -0.6rem;
	filter: contrast(50%);
}

.svg-invert {
	filter: invert();
}

.contact .email-svg,
.contact .telephone-svg {
	height: 1.3rem;
	width: 1.3rem;
}

.share-svg {
	height: 3.1rem;
	width: 3.1rem;
}


/*FOOTER*/

/* Contact */

.footer-contact div {
	display: inline-block;
}

.footer-contact .email-svg,
.telephone-svg {
	height: 1.0rem;
	width: 1.0rem;
}

/* Share icon */

@media (max-width: 575px) {
	.share-svg {
		padding-left: 24px !important;
		padding-right: 0px !important;
	}
}

/* Social icons */

.footer-social img {
	/*we want a min 48px square for lighthouse*/
	height: 3.1rem;
	width: 3.1rem;
	/*no padding*/
	padding-left: 0px;
	padding-right: 16px;
	/*so double padding here to compensate*/
	padding-top: 8px;
	/*padding - dimns = real size*/
	padding-bottom: 8px;
	/*padding - dimns = real size*/
}

@media (min-width: 576px) {
	.footer-social img {
		padding-left: 16px;
		padding-right: 0px;
	}
	.footer-social {
		text-align: right;
	}
}

.footer-nav p {
	font-size: 0.9rem;
	color: var(--primary-color);
	transition: color .2s;
	display: inline-block;
	letter-spacing: 0.06rem;
}
.footer-nav p:hover {
	color: var(--hover-color);
	transition: color .2s;
}
.footer-copyright p {
	font-size: 0.9rem;
	padding-top: 0px;
	margin-bottom: 0px;
	color: var(--primary-color);
	transition: color .2s;
	letter-spacing: 0.04rem;
}
.footer-copyright p a:hover {
	color: var(--hover-color);
	transition: color .2s;
}

@media (min-width: 576px) {
	.footer-copyright {
		text-align: right;
	}
	.footer-copyright p {
		display: inline-block;
	}
}

/*
==========================================================================
THUMB GRID
==========================================================================
*/

.responsive-container {
	position: relative;
	width: 100%;
	display: inline-block;
}

/* Vertical centering */
@media (max-width: 767px) {

	.dummy:not(.no-vertical-centering) {
		/* forces 1:1 aspect ratio */
		padding-top: 100%;
	}

	.img-container:not(.no-vertical-centering) {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		/* Align center inline elements */
		text-align: center;
		font: 0/0 a;
	}

	.img-container:not(.no-vertical-centering):before {
		content: ' ';
		display: inline-block;
		vertical-align: middle;
		height: 100%;
	}

	/* Stop portrait images getting too big on phones (home page, newsletter non-work images) */
	.no-vertical-centering img {
		max-height: 400px !important;
	}

}

/* Only use vertical centering on larger screens */
@media (min-width: 768px) {

	.dummy {
		/* forces 1:1 aspect ratio */
		padding-top: 100%;
	}

	.img-container {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		/* Align center inline elements */
		text-align: center;
		font: 0/0 a;
	}

	.img-container:before {
		content: ' ';
		display: inline-block;
		vertical-align: middle;
		height: 100%;
	}

}

.img-container img {
	vertical-align: middle;
	display: inline-block;
	/* Set maximum height to 100% of its parent */
	max-height: 90%;
	/* Set maximum width to 100% of its parent */
	max-width: 100%;
}


/* Add space under rows so it's clear caption goes with image above, not below */
.thumbs {
	margin-bottom: 1.5rem;
}

/*
========================================
Thumb text
========================================
*/

.thumbs p {
	/*font-size: 1.0rem;*/
	text-align: left;
	margin-bottom: 0px;
}

/* Add space above captions on phones */
@media (max-width: 769px) {
	.thumbs p {
		/* forces 1:1 aspect ratio */
		margin-top: 0.0rem;
	}
}

.thumbs a.btn, .thumbs button {
	/*margin-top: 1.4rem;*/
}

/*
==========================================================================
WORK
==========================================================================
*/

@media (min-width: 992px) {
	.work-page-height-100 {
		/* min-height, not height, as otherwise content can overlap work-page-long-text content if screen height is very short */
		min-height: 100vh;
	}
}

/*
========================================
Work close icon
========================================
*/

.work-close-icon {
	position: absolute;
	right: 25px;
	top: 30px;
	margin-top: -10px;
	height: 44px;
	width: 44px;
	line-height: 0;
	padding-bottom: 0.5rem;
	font-size: 2.1rem;
	font-weight: 400;
	border: none !important;
	background-color: transparent;
	color: var(--primary-color);
	transition: color .2s;
}

/* phone */
@media (max-width: 767px) {
	.work-close-icon {
		/* move right on phones */
		right: 11px;
	}
}

/* desktop */
@media (min-width: 768px) {
	.work-close-icon {
		/* move left */
		margin-right: 0px;
	}
}

.work-close-icon:hover {
	color: var(--hover-color);
}

/*
==========================================================================
PHOTOSWIPE
==========================================================================
*/

/* Overlay: white background, solid ; */
.pswp__bg {
	opacity: 1 !important;
	background: var(--background-color);
}

/* Counter at top left: hide */
.pswp__counter {
	display: none;
}

/*
========================================
Close
========================================
*/

.pswp__button--close {
	font-size: 2.1rem;
	margin-top: .5rem;
}

/*
========================================
Zoom icon
========================================
*/

.pswp__button--zoom {
	margin-top: .43rem;
}

/* Phone+ */
@media (min-width: 768px) {
	.pswp__button--zoom {
		margin-right: 1rem;
	}
}

/*
========================================
Arrows
========================================
*/

/* Arrows */
.pswp__button--arrow--prev .pswp__icn {
	transform: scale(-1, 1);
}
.pswp__button--arrow--next .pswp__icn {
	transform: scale(1, -1);
}
.pswp__button--arrow {
	font-size: 3.2rem;
	width: auto;
	height: auto;
	/* Bigger clickable area then recenter vertically */
	margin-top: -10rem !important;
	padding-top: 6.4rem !important;
	padding-bottom: 10rem !important;
}

/*
========================================
Close + Arrows
========================================
*/

/* Color */
.pswp__button {
	color: var(--primary-color);
	transition: color 0.2s;
}
.pswp__button:hover {
	color: var(--hover-color);
	transition: color 0.8s !important;
}

/* Phone */
@media (max-width: 575px) {
	.pswp__button--close {
		margin-right: .5rem;
	}
	.pswp__button--arrow--prev {
		margin-left: 1.35rem !important;
	}
	.pswp__button--arrow--next {
		margin-right: 1.35rem !important;
	}
	/* Arrows: center vertically better on phones */
	.pswp__button--arrow {
		padding-top: 7.8rem !important;
	}
}
/* Tablet */
@media (min-width: 576px) and (max-width: 767px) {
	.pswp__button--close {
		margin-right: .5rem;
	}
	.pswp__button--arrow--prev {
		margin-left: 1.35rem !important;
	}
	.pswp__button--arrow--next {
		margin-right: 1.35rem !important;
	}
}
/* Desktop */
@media (min-width: 768px) {
	.pswp__button--arrow--prev {
		padding-left: 44px !important;
	}
	.pswp__button--close,
	.pswp__button--arrow--next {
		padding-right: 40px !important;
	}
}

/*
========================================
Work alternate image thumbnails
========================================
*/

.work-thumb-vertical-spacing {
	margin-top: 0.6rem;
	/*align with top of caption on non-thumb pages */
	margin-left: 0.75rem;
	margin-bottom: 0.5rem;
}

.work-thumb-container {
	display: inline;
}

.work-thumb-container img {
	margin-bottom: 1rem;
	margin-right: 0.75rem;
	/* For current thumb outline, inset rather than outset */
	box-sizing: border-box;
}

.work-thumb-container:last-child img {
	/*remove horiz space if last thumb*/
	margin-right: 0rem;
}

.work-thumb-container img:hover {
	cursor: pointer !important;
}

.thumb-current img {
	outline: solid 1px #ccc;
	outline-offset: 6px;
}

/*
========================================
Work loading spinner
========================================
*/

.work-spinner {
	display: block;
	border: 5px solid #333;
	border-radius: 40px;
	height: 40px;
	left: 50%;
	margin: -20px 0 0 -20px;
	opacity: 0;
	position: absolute;
	top: 50%;
	width: 40px;
	z-index: -1;
	-webkit-animation: pulsate 1s ease-out infinite;
	-moz-animation: pulsate 1s ease-out infinite;
	-ms-animation: pulsate 1s ease-out infinite;
	-o-animation: pulsate 1s ease-out infinite;
	animation: pulsate 1s ease-out infinite;
	/* add delay to not showing through fading in image */
	animation-delay: 0.8s;
}

/*
========================================
Work caption
========================================
*/

.work-caption p {
	font-size: 1.2rem;
	text-transform: ;
	margin-bottom: 0px;
}

.work-caption .work-text p {
	text-transform: none;
}

.work-caption .work-text p+p {
	margin-top: 1.5rem;
}

/* desktop - caption centered vertically */
@media (min-width: 992px) {
	.work-page-left-column-center-vertical {
		/* centers caption column vertically */
		display: flex;
		justify-content: left;
		align-items: center;
	}
}

/* Extended caption: increase space between paragraphs to align lines of text */
@media (min-width: 992px) {
	.work-page-long-text p {
		margin-bottom: 2rem;
	}
}

/*
========================================
Work links: Share icon
========================================
*/

/* Share icon: position on phones */
.work-links .share-svg {
	padding-left: .75rem !important;
	padding-right: 1rem !important;
}

/*
========================================
Arrows
========================================
*/

.left-arrow, .right-arrow {
	font-size: 3.2rem;
	line-height: 0.15;
	font-weight: 400;
	color: var(--primary-color);
	transition: color .2s;
}

.left-arrow {
	margin-left: 0.25rem;
	margin-right: .5rem; /* Minimum 8px (or poss more) if icons less than 48x48 */
	padding-right: 0.125rem;
}

.right-arrow {
	padding-left: 0.125rem;
}

@media (max-width: 365px) {
	.left-arrow, .right-arrow {
		font-size: 3.0rem;
	}
}

.left-arrow:hover, .right-arrow:hover {
	color: var(--hover-color);
}

.arrows-label {
	text-transform: uppercase;
	font-weight: 300;
	letter-spacing: 0.06rem;
	vertical-align: top;
	display: inline-block;
	font-size: 0.8rem;
	margin-top: -0.185rem;
}

/*
========================================
Work arrows
========================================
*/

.right-arrow.work-arrows {
	float: right;
}

.left-arrow.work-arrows {
	margin-left: -0.4rem;
}
.right-arrow.work-arrows {
	margin-right: -0.4rem;
}

/* desktop - wider clickable area - experimental, can delete entire media query*/
	@media (min-width: 768px) {
	.left-arrow.work-arrows {
		margin-left: -1.8rem;
		padding-left: 2.51rem;
		margin-top: -10rem;
		padding-top: 10rem;
		padding-bottom: 10rem;
	}
	.right-arrow.work-arrows {
		/*margin-right: -1.8rem;*/
		padding-right: 40px;
		margin-top: -10rem;
		padding-top: 10rem;
		padding-bottom: 10rem;
	}
}

/* desktop */
@media (min-width: 992px) {

	.left-arrow.work-arrows {
		left: 32px;
	}
	.right-arrow.work-arrows {
		right: 0px; /* Was 30px, but caused scroll bars over ~2000px window width */
		margin-right: 0;
	}
	.left-arrow.work-arrows,
	.right-arrow.work-arrows {
		position: absolute;
		top: calc((50vh) - 1.5rem);
		z-index: 1;
	}
}

/*
==========================================================================
VIEW ON A WALL
==========================================================================
*/
.container-wall {
	height: calc(var(--vh, 1vh) * 100)
}

/* Put top and bottom in a column and center horizontally */
.container-wall {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.container-wall-absolute {
	background: white;
	position: fixed;
	top: 0;
	left: 0;
}

/* Using foreground image */
.top {
	height: 50vh;
	width: 100vw;
	background: #F8F4F1;
}

/* Phone top wall colour */
@media (max-width: 991px) {
	.top {
		background: white;
	}
}

.top {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 10vh;
}

.top img {
	margin-bottom: 1rem;
	margin-top: 2rem;
	box-shadow: 0 0.5rem 0.8rem 0.05rem rgba(0, 0, 0, 0.20);
}

/* Using foreground image */
.bottom {
	height: 50vh;
	width: 100vw;
	overflow: hidden;
}

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

.bottom img {
	height: 100%;
	align-self: flex-start;

}

.non-wall-content {
	display: ;
}

.container-wall {
	transition: opacity 0.3s;
}

/*
==========================================================================
ENQUIRE
==========================================================================
*/

.share-enquire-container {
	/*center vertically */
	display: flex;
	justify-content: center;
	align-items: center;
	/*PHONE height of box that image is centered vertically in*/
	/*Min-height 100vh ensures vert centering, while allowing for scrolling on small screens */
	/*80vh+ results in vertical scroll bar at 1080x2560*/
	min-height: 75vh;
}

.share-enquire-container > form {
	flex-grow: 1;
}

.share-enquire-container a:hover {
	color: var(--hover-color);
	filter: contrast(30%); /*50% close to #444*/
	transition: filter 0.2s;
}

/* Formbuilder: override field label font weight */
.InputfieldHeader {
	font-weight: 300;
}

.InputfieldStateRequired > .InputfieldHeader:first-child:after {
	color: var(--accent-color);
}

/* Formbuilder: error styling */
.share-enquire-container .InputfieldStateRequired > .InputfieldHeader:first-child:after {
	color: var(--accent-color);
	font-size: 1.1rem;
	font-weight: 300;
}

/* Formbuilder (actually Bootstrap): individual field error text */
.share-enquire-container .text-danger {
	color: var(--accent-color) !important;
}

/* Formbuilder (actually Bootstrap): error alerts in panels */
.share-enquire-container .alert-danger {
	background-color: var(--accent-color-light) !important;
	border-color: var(--accent-color-light) !important;
}

/* Formbuilder: submit button */
#wrap_enquire_submit {
	margin-top: 2.25rem;
}

/*
==========================================================================
FORMS
==========================================================================
*/

label { /* Currently used for country/shipping only */
	font-size: 1.2rem; /* Matches caption font size */
	margin-bottom: 0.5rem;
}

.form-group {
	margin-bottom: 1rem;
}

.form-control {
	border: solid 1px var(--border-color);
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	font-size: 1.0rem;
}

.form-control::placeholder {
	color: var(--primary-color);
	font-weight: 300;
	opacity: 1;
	/* Firefox */
}

.form-select-lg, .form-select-lg {
	border-radius: 0;
}

.form-check-input:checked {
	background-color: var(--primary-color);
	border-color: var(--primary-color);
}

/*
==========================================================================
PAGINATION
==========================================================================
*/

/* Solve active item right-alignment issue */
ul.pagination li:not(.active):last-child {
	margin-right: -0.5rem;
}

.pagination-lg .page-link {
	font-size: 1.1rem !important;
}

.page-item {
	list-style-type: none;
	/* remove bullets after changing their style below for normal use */
}

.disabled {
	pointer-events: none !important;
}

/* without border */
.page-link {
	border: none;
	color: var(--primary-color);
	background-color: white;
	transition: background-color .2s;
}

/* without border */
.page-item.active .page-link {
	background-color: var(--primary-color);
	border: none;
}

/* without border */
.page-link:hover {
	color: var(--primary-color);
	background-color: #eee;
	border: none;
}

.page-link:visited {
	color: var(--primary-color);
}

/* Seperator - three dots */
.MarkupPagerNavSeparator {
	padding-top: .7rem;
}

/* Remove rounded corners on regular and large size pagination */
.page-item:first-child .page-link,
.pagination-lg .page-item:first-child .page-link {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.page-item:last-child .page-link,
.pagination-lg .page-item:last-child .page-link {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

/* Make number links square */
.pagination-lg .page-link {
	padding-left: 0.8rem !important;
	padding-right: 0.8rem !important;
}

/* Make left arrow link square */
.MarkupPagerNavPrevious > .page-link {
	padding-left: 0.6rem !important;
	padding-right: 0.6rem !important;
}

/* Make right arrow link square */
.MarkupPagerNavNext > .page-link {
	padding-left: 0.6rem !important;
	padding-right: 0.5rem !important;
}

/* Remove browser outline on click */
.page-link:focus {
	box-shadow: none;
}

/*
==========================================================================
ON NOW
==========================================================================
*/

.on-now {
	text-transform: uppercase;
	font-size: .9rem;
	color: var(--primary-color);
	font-weight: 300;
	letter-spacing: 0.03rem;
	display: inline-block;
}

.on-now.on-now-upcoming {
	background: white;
	padding: 0;
	color: var(--primary-color);
	font-weight: 300;
}
.cover-heading .on-now.on-now-upcoming {
	background: transparent;
	color: var(--primary-color-negative);
	font-weight: 300;
}
.on-now.on-now-past{
	background: white;
	padding: 0;
	color: var(--primary-color);
	margin-bottom: 0.5rem;
	font-weight: 300;
}

/*
==========================================================================
ARTIST
==========================================================================
*/

.artist-suffix {
	font-size: 75%;
	font-weight: 200;
	letter-spacing: 0.03rem;
	display: inline-block;
}

.artist-nav {
	font-size: 1.1rem;
	font-weight: 400;
}

.artist-nav ul {
	padding-inline-start: 0; /* Removed unwanted horiz space before */
	margin-bottom: 0; /* Remove unwanted space below */
}

.artist-nav ul li {
	display: inline-block;/* Put on a row */
}

.artist-name {
	display: inline-block;
}

.artist-page-title {
	font-weight: 200;
	display: inline-block;
}

/*
========================================
Statement and Biography texts
========================================
*/

.columns-2,
.columns-artist-nav-footer,
.work-page-long-text {
	/* 3rem matches causes column left edges to align with BS grid correctly */
	column-gap: max(calc(4vw), 3rem);
	/* When there are only two items, prevents Chrome from putting them both in the first column */
	widows: 2; /* Min # of lines to have at top of column (second onwards) */
	orphans: 2; /* Min # of lines to have at foot of column */
	display: inline-block;
	column-count: 1;
}

/* Phone */
@media (max-width: 575px) {
	.columns-artist-nav-footer {
		column-count: 2;
	}
}

/* Tablet small */
@media (min-width: 576px) and (max-width: 767px) {
	.columns-artist-nav-footer {
		column-count: 2;
	}
}

/* Tablet large */
@media (min-width: 768px) and (max-width: 991px) {
	.columns-2 {
		column-count: 2;
	}
	.columns-artist-nav-footer {
		column-count: 2;
	}
	.work-page-long-text {
		column-count: 2;
	}
}

/* Desktop */
@media (min-width: 992px) and (max-width: 1399px) {
	.columns-2 {
		column-count: 3;
	}
	.columns-artist-nav-footer {
		column-count: 3;
	}
	.work-page-long-text {
		column-count: 2;
	}	
}

/* XXL */
@media (min-width: 1400px) {
	.columns-2 {
		column-count: 4;
	}
	.columns-artist-nav-footer {
		column-count: 4;
	}
	.work-page-long-text {
		column-count: 2;
	}	
}

/*
==========================================================================
PRIVACY WIRE / COOKIES
==========================================================================
*/

/* RESETS */

.privacywire {
	padding: 0 !important;
}

/*
========================================
Banner
========================================
*/

.privacywire-banner {
	background: #efefef !important;
	box-shadow: none !important;
}

/* Padding */

.privacywire {
	padding-left: 1.75rem !important;
	padding-right: 1.75rem !important;
	padding-top: 0.5rem !important;
	padding-bottom: 1rem !important;
}

@media (min-width: 576px) {
	.privacywire {
		padding-left: 3.25rem !important;
		padding-right: 3.25rem !important;
		padding-top: 1.25rem !important;
		padding-bottom: 2rem !important;
	}
}

@media (min-width: 992px) {
	.privacywire {
		padding-left: 3.75rem !important;
		padding-right: 3.75rem !important;
	}
}

@media (min-width: 1400px) {
	.privacywire {
		padding-left: 5.75rem !important;
		padding-right: 5.75rem !important;
		padding-top: 2rem !important;
		padding-bottom: 3rem !important;
	}
}

@media (min-width: 1800px) {
	.privacywire {
		padding-left: 6.2rem !important;
		padding-right: 6.2rem !important;
		padding-top: 3rem !important;
		padding-bottom: 3rem !important;
	}
}

/* Heading */

.privacywire-header {
	font-size: 1.25rem;
	font-weight: 500 !important;
	text-transform: uppercase;
	margin-bottom: 1rem;
	line-height: 1.2 !important;
	margin-top: 1rem;
}

/* Text */

.privacywire-text p {
	padding-bottom: 0.5rem;
}

/* Buttons */

.privacywire-buttons button, .privacywire-consent-button {
	background-color: var(--primary-color);
	color: white;
	text-transform: uppercase;
	border: solid 1px var(--primary-color);
	padding-bottom: 7.2px;
	padding-left: 12px;
	padding-right: 12px;
	padding-top: 6px;
	font-weight: 300;
	margin-right: 1rem;
	margin-bottom: 1rem;
}

.privacywire-buttons button.allow-necessary {
	background-color: white;
	color: #6c6c6c;
	text-transform: uppercase;
	border: solid 1px #ebebeb;
	font-weight: 300;
}

/*
========================================
After selection message
========================================
*/

.privacywire-message {
	background: #efefef !important;
	font-size: 1.32rem;
}

@media (max-width: 575px) {
	.privacywire-message {
		padding-top: 1.25rem !important;
		padding-bottom: 1.5rem !important;
	}
}

@media (min-width: 576px) and (max-width: 1399px) {
	.privacywire-message {
		padding-top: 1.5rem !important;
	}
}

@media (min-width: 1400px) {
	.privacywire-message {
		padding-top: 1.5rem !important;
		padding-bottom: 2rem !important;
	}
}

@media (min-width: 1800px) {
	.privacywire-message {
		padding-top: 1.5rem !important;
		padding-bottom: 2rem !important;
	}
}

/*
========================================
Individual content elements
========================================
*/

.privacywire-ask-consent {
	background: #efefef !important;
	padding: 2.25rem;
}

/*
==========================================================================
EDIT PAGE LINK
==========================================================================
*/

.edit-page-button {
	position: fixed;
	bottom: 0;
	right: 0;
}

/* Move Tracy Debug bar over to make room */
#tracy-debug-bar {
	margin-right: 50px !important;
}

/*
==========================================================================
ANIMATION - FADE - LOGO, NAV, PAGE TITLE
==========================================================================
*/

main.animate,
.img-container-work img {
	/* Also adust spinner animation time */
	animation-name: fade-in;
	animation-duration: 0.8s;
	animation-fill-mode: both
	-webkit-animation-name: fade-in
	-webkit-animation-duration: 0.8s;
	-webkit-animation-fill-mode: both;
}

@keyframes fade-in {
	from {
		opacity: .5
	}

	to {
		opacity: 1
	}
}

/*
==========================================================================
AOS
==========================================================================
*/

[data-aos][data-aos][data-aos-duration="800"],
body[data-aos-duration="800"] [data-aos] {
	transition-duration: .0s
}

[data-aos][data-aos][data-aos-delay="800"],
body[data-aos-delay="800"] [data-aos] {
	transition-delay: 0
}

[data-aos][data-aos][data-aos-delay="800"].aos-animate,
body[data-aos-delay="800"] [data-aos].aos-animate {
	transition-delay: .0s
}

[data-aos^=fade][data-aos^=fade] {
	opacity: 0;
	transition-property: opacity, transform
}

[data-aos^=fade][data-aos^=fade].aos-animate {
	opacity: 1;
	transition-duration: 0.8s;
	transform: translateZ(0)
}

/*
========================================
Splide
========================================
*/

/* Gap between slide: use this instead of js attribute to avoid page load alignment issue */
.splide__slide {
	margin-right: 3rem !important;
}

.splide__arrow {
	/* Arrow background box color */
	background: rgba(255, 255, 255, 0.50) !important;
	border-radius:0% !important;
	height: 2em !important;
	opacity:0.7 !important;
	opacity:1 !important;
	width: 2em !important;
}

.splide__arrow--prev {
	left: 0em !important;
}

.splide__arrow--next {
	right: 0em !important;
}

/* Pagination: move under slider */
.splide__pagination {
	position: relative !important;
	margin-top: 1.5em !important;
}

/* Pagination other dots: recolor */
.splide__pagination__page {
	opacity: 1 !important;
	border-radius: 0 !important;
}

/* Pagination current dot: recolor */
.splide__pagination__page.is-active {
	background: var(--accent-color-dim) !important;
}

/* Pagination: hide links so google doesn't give 'clickable area too small' issue */
.splide__pagination__page {
	pointer-events: none;
}

/* Cursor */
.splide__slide img {
	cursor: move; /* fallback if grab cursor is unsupported */
	cursor: grab;
	cursor: -moz-grab;
	cursor: -webkit-grab;
}
 /* (Optional) Apply a "closed-hand" cursor during drag operation. */
.splide__slide img:active {
	cursor: grabbing;
	cursor: -moz-grabbing;
	cursor: -webkit-grabbing;
}

/* Few images: center slides */
.splide:not( .is-overflow ) .splide__list {
	justify-content: center;
}

/* Few images: hide arrows */
.splide:not(.is-overflow) .splide__arrows {
  display: none;
}

/* Few images: then remove gap from last (possibly causes issue with first slide or two being cut off)*/
.splide:not( .is-overflow ) .splide__slide:last-child {
	margin: 0 !important;
}

/* Align images at bottom */
.splide__list {
	align-items: baseline;
}

/* Phones */
@media /*(max-aspect-ratio: 1.1/1) and*/ /*OR NOT WORKING ON SAFARI 13.1.2*/ (max-width: 575px) {
	/* Phones: if portrait AND phone-sized device */
	.splide__slide img {
		max-width: calc(calc(var(--vw, 1vw) * 100) - 3.5rem);
		max-height: 70vw;
		width: auto;
		height: auto;
	}
}

/* Desktop */
@media /*(min-aspect-ratio: 1.1/1) or*/ /*OR NOT WORKING ON SAFARI 13.1.2*/ (min-width: 576px) {
	/* Desktop: if landscape AND/OR large device */
	.splide__slide img {
		max-width: 500px; /* 32.6vw */
		max-height: 333px; /* 35vh */
		/* Related issues: 1. Slider jumping down the page when it encounters a tall image. 2. Lazy loading. 3. Img tag containing height and width attributes. 4. width: auto, height: auto in this selector (and the mobile one). 5. Images becoming squashed (narrow window), or stretched (wide window) horizontally. Either tolerate the jump, or tolerate not having lazy loading. */
		width: auto;
		height: auto;
	}
}

/* Space above caption */
.splide .splide__slide__container + p {
	margin-top: 1rem;
}

.splide p {
	font-size: 1rem;
	margin-bottom: 0;
	/* Prevent caption getting too wide, opening up horiz gaps between images */
	max-width: max(280px, 12vw);
	letter-spacing: 0.02rem;
}

.exhibition-legacy .splide p:nth-of-type(1) {
	font-weight: 400;
}

.exhibition-legacy .splide p:nth-of-type(2) {
	font-style: italic;
}

/* Arrows */
.splide__arrow:hover:not(:disabled) {
	opacity: 1 !important;
	background: white !important;
	color: white !important;
}
.splide__arrow:disabled {
	opacity: .3 !important;
	display: none;
}

/*
========================================
Artist Tables
========================================
*/

.table-table {
	/* Override bootstrap color */
	width: 100%;
	letter-spacing: 0.02rem
}

.table-table p {
	font-size: 1rem;
	margin-bottom: 0;
}

/* Cells: border at top, not bottom */
.table-cell {
	border-top: dotted 1px #ccc;
	padding-top: .5rem;
	padding-bottom: .5rem;
	padding-right: 0.25rem;
}

/* Cells: remove border from years with multiple entries */
.table-cell:empty {
	display: none;
}

.table-cell-year {
	font-weight: 500;
}

.table-exhibition a {
	color: var(--accent-color);
	font-weight: 500;
}

/* Stops years appearing last in column, also: */
/* Safari: stop it missing horiz lines, not top aligning columns */
.table-row {
	display: block;
	page-break-inside: avoid;
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
}

.table-table,
.table-row,
.table-row {
  display: block;
}

/*
========================================
Zoom icon at bottom left of images on legacy
exhibition and work pages
========================================
*/

/* To enable icon to be overlaid thumbnail */
.splide__slide__container a {
	position: relative;
}

/* Position overlaid icon on thumbnail */
.image-zoom-icon {
	position: absolute;
	bottom: 0;
	left: 0;
}

/* Zoom icon styling
   Image is in exhibition-legacy template */
.zoom-svg {
	height: 16px;
	width: 16px;
	filter: invert();
	margin-top: 0px;
	margin-bottom: .6rem;
	margin-left: 1rem;
}

/*
========================================
DROP CAPS
========================================
*/

/* Apply drop caps to first pb-text element only, and not if it is also a pb-blockquote */
div.pb-text:not(.pb-blockquote):nth-child(1 of .pb-text) p:first-child:first-letter {
	font-weight: 500;
	float: left;
	font-size: 4.2rem;
	height: .7em;  /* firefox: has to exist, and has to be em*/
	line-height: .7em; /* firefox: has to be em*/
	margin-top: .1em; /* firefox: has to be like this */
	padding-right: 5px;
	margin-left: -4px;
}

/*
========================================
TEXT HORIZONTAL RULE BETWEEN SECTIONS
========================================
*/

.pb-text p:last-child,
.pb-blockquote blockquote:last-child,
.pb-blockquote p:last-child,
.pb-image p:last-child{
	margin-bottom: 0;
}

.pb-heading:empty {
	display: none !important;
}

/*
========================================
Quote
========================================
*/

blockquote p {
	font-weight: 200;
	font-style: italic;
	font-size: 1.5rem;
	font-family: "Yantramanav", sans-serif;
}

.exhibition-legacy blockquote {
	margin-bottom: 2.5rem;
}

/* Make italicised words non-italic */
blockquote p em, blockquote p i {
	font-style: normal;
}

.pb-blockquote-large p {
	font-size: calc(1.5rem + 0.5vw);
	font-style: italic;
}

/* Padding above blockquote pb */
.pb blockquote {
	margin-bottom: 0;
	/*padding-top: 2rem !important;*/
}

/* Padding above blockquote exhibition legacy */
.exhibition-legacy blockquote {
	padding-top: 4rem !important;
}

blockquote p:nth-child(1)::before {
	content: "\201C";
	font-size: 10rem; /* Was 10rem and 200 weight */
	line-height: 0px;
	position: absolute;
	font-weight: 300;
	font-style: normal;
	margin-left: -.65rem;
	margin-top: 1rem;
}

/*
========================================
Page Builder Image and Caption
========================================
*/

.pb-image p {
	font-size: 1.0rem;
	margin-top: 1rem;
}

.pb-image img {
	max-height: 700px;
}

/*
========================================
About
========================================
*/

.about .pb-image img {
	max-height: 300px;
}

.container-fluid {
	max-width: 1920px;
}

.shaded {
	max-width: none;
}
*/

.shaded {
	background: none;
}

/* Pagebuilder HR */
hr {
	border-top: dotted 1px #ccc;
}

/*
==========================================================================
FLIPBOOK
==========================================================================
*/

/* For 3d mode only: add outline*/
.book > div > div > div:nth-child(even) > div > div > div {
	border-right: solid 1px #ddd;
}

.flipbook-currentPageHolder {
	height: 22px !important; /* Box correct height */
	background-color: white !important;
}

/* Lightbox: background color */
.flipbook-overlay {
	background: rgb(221, 221, 221) !important;
}

/* Lightbox close icon: move into corner on phones */
@media only screen and (max-width: 768px) {
  .flipbook-menu-fixed .flipbook-menu {
    justify-content: flex-end !important;
  }
}

/*
==========================================================================
PUBLICATIONS
==========================================================================
*/

.publication > p {
	font-size: 1.0rem;
	margin-bottom: 0.0rem;
	border-top: dotted 1px #ccc;
	padding-top: .5rem;
	padding-bottom: .5rem;
	padding-right: 0.25rem;
}

/*
==========================================================================
EXHIBITIONS PAGE
==========================================================================
*/

.exhibitions-year {
	font-style: normal;
	font-size: 0.9rem;
	letter-spacing: 0.04rem;
}

/* Year heading, when it is at top of page */
.exhibitions .thumbs .col-12:first-child {
	margin-top: 0 !important;
}

/*
==========================================================================
ARTIST GROUP EXHIBITIONS
==========================================================================
*/

/* Stops years appearing last in column, also: */
/* Safari: stop it missing horiz lines, not top aligning columns */
.artist-group-exhibitions div {
	display: block;
	page-break-inside: avoid;
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
}

.artist-group-exhibitions div + div > p.h3 {
	margin-top: 1rem;
}

/*
==========================================================================
ARTIST NAV FOOTER
==========================================================================
*/

.artist-nav-footer {
	font-size: 1.0rem;
	margin-bottom: 0.25rem;
	letter-spacing: 0.03rem;
}

.artist-nav-footer.active {
	font-weight: 500;
}

.footer-email {
	letter-spacing: 0.025rem;
}

/*
==========================================================================
STICKY NAV
==========================================================================
*/

.scrolled-down{
	transform:translateY(-100%); transition: all 0.2s ease-in-out;
}
.scrolled-up{
	/* Hidden as it causes offcanvas menu to be cut off vertically */
	/*transform:translateY(0); transition: all 0.3s ease-in-out;*/
	transition: all 0.2s ease-in-out;
}

/*
==========================================================================
OFF CANVAS
==========================================================================
*/

@media (max-width: 991px) {
	.offcanvas {
		width: 100vw;
		/* Add fade effect */
		opacity: 0;
		transition: opacity 0.2s ease-in-out;
		z-index: 11000 !important;
		background: var(--background-color);
		/* Align nav items left on phones */
	}
	.navbar-collapse {
		align-items: flex-start;
	}
	.offcanvas-header {
		align-self: flex-end;
	}
	.offcanvas.show {
		opacity: 1 !important;
	}
	.offcanvas .nav-item {
		font-size: 1.4rem;
	}
}

@media (min-width: 992px) {
	/* Align nav items left on phones */
	.navbar-collapse {
		align-items: flex-end;
	}
}

/*
==========================================================================
NEWSLETTER
==========================================================================
*/

/* Image border */
.newsletters .newsletter-image {
	border: solid 1px #ddd;
}

/* PDF icon rollover */
.newsletters .newsletter-link:hover .pdf-svg {
	filter: contrast(10%);
}