/* ==================== 
This houses all general styles specific to each page.
All global styles are in styles.css.
Specific block styles are located in their specific folders.
Specific template styles are in tempary files. Once a design is chosen move styles into main.css
 ==================== */
#primary-container[data-barba-namespace="home-page"] main {
	padding: 0;
	overflow: hidden;
	background-color: #000;
}

/* ======================= 
 Profile Page
 ======================= */
#primary-container[data-barba-namespace="profile-page"] {
	background-color: #000;
	color: #fff;
}
#primary-container[data-barba-namespace="profile-page"] main p {
	font-size: 1.4rem;
	line-height: 1.3;
	text-rendering: optimizeLegibility;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	max-width: 18em;
	margin: 0 0 0.5rem;
}
@media screen and (min-width: 40em) {
	#primary-container[data-barba-namespace="profile-page"] main p {
		font-size: 2rem;
	}
}
#primary-container[data-barba-namespace="profile-page"] h3 {
	color: #aaa7a0;
	margin-bottom: 0.5em;
}
@media screen and (min-width: 40em) {
	#primary-container[data-barba-namespace="profile-page"] h3 {
		margin-bottom: 0;
	}
}
#primary-container[data-barba-namespace="profile-page"] h4 {
	color: #aaa7a0;
	margin: 1.6em 0 0.5em;
}
#primary-container[data-barba-namespace="profile-page"] .text-block ul {
	padding-top: 1em;
}
@media screen and (min-width: 40em) {
	#primary-container[data-barba-namespace="profile-page"] .text-block ul {
		padding-top: 0;
	}
}
#primary-container[data-barba-namespace="profile-page"] ul li {
	color: #aaa7a0;
	margin-bottom: 0.3em;
	text-indent: -0.75em;
	padding-left: 0.75em;
}
@media screen and (min-width: 40em) {
	#primary-container[data-barba-namespace="profile-page"] ul li {
		margin-bottom: 0;
	}
}

#primary-container[data-barba-namespace="profile-page"] ul li a {
	color: #fff;
	transition: color 0.5s ease;
}
#primary-container[data-barba-namespace="profile-page"] ul li a:hover {
	color: var(--color-orange);
}

/* ======================= 
 Locator Page
 ======================= */
#primary-container[data-barba-namespace="locator-page"] {
	background-color: #000;
}

/* ======================= 
 Process Page
 ======================= */
@media screen and (max-width: 49.999em) {
	/* .shoots-page:not(.navigation-toggled) #site-logo {
		color: #fff;
	} */
	#primary-container[data-barba-namespace="shoots-page"]
		.gallery-item-inner-container {
		/* display: flex;
		flex-flow: column;
		flex-direction: column-reverse; */
		padding: 0 0 5.5em;
	}
	#primary-container[data-barba-namespace="shoots-page"]
		.gallery-item
		.gallery-item-info {
		padding: 1em 0 0.5em;
		margin: 0;
	}
	#primary-container[data-barba-namespace="shoots-page"]
		.gallery-item
		.gallery-item-info
		.gallery-description {
		display: none;
	}
	#primary-container[data-barba-namespace="shoots-page"]
		.gallery-item
		.heart-slide[tab-index="-1"] {
		visibility: visible;
	}
	#primary-container[data-barba-namespace="shoots-page"]
		.gallery-item
		.heart-slide[data-caption]::after {
		content: attr(data-caption);
		position: relative;
		/* bottom: 0; */
		display: block;
		padding: 0.35em 0 0.75em;
		font-style: italic;
		font-size: 0.9em;
		color: #000;
	}
}

/* ======================= 
 Identities Page
 ======================= */
#primary-container[data-barba-namespace="shoots-page"]
	.gallery-item-info
	.gallery-work,
#primary-container[data-barba-namespace="identities-page"] .gallery-item-info {
	display: none;
}
@media screen and (max-width: 49.999em) {
	/* .page-inset#primary-container[data-barba-namespace="shoots-page"] main, */
	#primary-container[data-barba-namespace="identities-page"] main {
		padding: 9.55rem 0 0 0;
	}

	#primary-container[data-barba-namespace="shoots-page"]
		.gallery-item
		.heart-slideshow,
	#primary-container[data-barba-namespace="identities-page"]
		.gallery-item
		.heart-slideshow {
		height: auto;
		min-height: 100vh;
		padding-top: 0;
	}

	#primary-container[data-barba-namespace="shoots-page"]
		.gallery-item
		.heart-slideshow
		.heart-slide,
	#primary-container[data-barba-namespace="identities-page"]
		.gallery-item
		.heart-slideshow
		.heart-slide {
		position: relative;
		overflow: visible;
		height: auto;
		opacity: 1;
	}

	#primary-container[data-barba-namespace="shoots-page"]
		.gallery-item
		.heart-slideshow
		.heart-slide:not(:last-of-type),
	#primary-container[data-barba-namespace="identities-page"]
		.gallery-item
		.heart-slideshow
		.heart-slide:not(:last-of-type) {
		margin-bottom: 1px;
	}

	#primary-container[data-barba-namespace="shoots-page"]
		.gallery-item
		.heart-slideshow
		button,
	#primary-container[data-barba-namespace="identities-page"]
		.gallery-item
		.heart-slideshow
		button {
		pointer-events: none;
	}
}
@media screen and (min-width: 50em) {
	#primary-container[data-barba-namespace="identities-page"] main {
		padding: 0;
	}

	#primary-container[data-barba-namespace="identities-page"]
		.heart-slideshow-container {
		width: 100%;
		max-width: none;
		height: 100vh;
		height: 100dvh;
	}
	#primary-container[data-barba-namespace="identities-page"] .gallery {
		overflow: hidden;
		scroll-snap-type: none;
	}
	#primary-container[data-barba-namespace="identities-page"]
		.heart-slideshow-container
		.heart-slideshow {
		position: relative;
		height: 100%;
		padding: 0;
	}
	#primary-container[data-barba-namespace="identities-page"]
		.gallery-item
		.heart-slideshow
		button.heart-prev {
		cursor:
			url(../assets/cursors/white/arrow-left.png) 2 8,
			pointer;
		cursor:
			url(../assets/cursors/white/arrow-left.svg) 2 8,
			pointer;
		cursor:
			-webkit-image-set(
					url(../assets/cursors/white/arrow-left.png) 1x,
					url(../assets/cursors/white/arrow-left@2x.png) 2x
				)
				2 8,
			pointer;
	}
	#primary-container[data-barba-namespace="identities-page"]
		.gallery-item
		.heart-slideshow
		button.heart-next {
		cursor:
			url(../assets/cursors/white/arrow-right.png) 2 8,
			pointer;
		cursor:
			url(../assets/cursors/white/arrow-right.svg) 2 8,
			pointer;
		cursor:
			-webkit-image-set(
					url(../assets/cursors/white/arrow-right.png) 1x,
					url(../assets/cursors/white/arrow-right@2x.png) 2x
				)
				2 8,
			pointer;
	}
}

/* Portraits/Books Page Styles */
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	main {
	padding: 0;
}

#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item-inner-container
	> .gallery-item-info {
	display: none;
}
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: auto;
	/* overscroll-behavior: none; */
	scroll-snap-type: none;
}

#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow {
	height: auto;
	min-height: 100vh;
	padding-top: 0;
	pointer-events: all;
	/* touch-action: none; */
}

#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow
	.heart-slide {
	position: relative;
	overflow: visible;
	height: auto;
	opacity: 1;
}

#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow
	.heart-slide:not(:last-of-type) {
	margin-bottom: 1px;
}

#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow
	button {
	pointer-events: none;
}
#books,
#portraits {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	padding: 4.35rem 0.5rem 0 2rem;
}
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.heart-slideshow-container
	.heart-slideshow
	.heart-slide {
	visibility: visible;
	background-color: #fff;
	pointer-events: all;
	width: 100%;
	padding-bottom: 3rem;
}
@media screen and (min-width: 40em) {
	body.books-page,
	body.books-page #page,
	body.portraits-page,
	body.portraits-page #page,
	#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	),
	#primary-container:is(
			[data-barba-namespace="portraits-page"],
			[data-barba-namespace="books-page"]
		)
		.site-main,
	#primary-container:is(
			[data-barba-namespace="portraits-page"],
			[data-barba-namespace="books-page"]
		)
		.site-main
		.gallery,
	#portraits,
	#books {
		position: fixed;
		top: 0;
		right: 0;
		bottom: auto;
		left: 0;
		width: 100%;
		height: 100vh;
		height: 100dvh;
		min-height: 100vh;
		min-height: 100dvh;
		max-height: 100vh;
		max-height: 100dvh;
		overflow: hidden;
		overscroll-behavior: none;
		overscroll-behavior-y: none;
	}
	#portraits {
		/* position: fixed;
		top: 0;
		padding:0 */
		/* left: 0;
		width: 100%;
		height: 100vh;
		overflow: scroll;
		scroll-snap-type: y mandatory;
		padding: 2.9rem 1rem 0 9rem;
		padding-top: 0; */
	}
	#primary-container:is(
			[data-barba-namespace="portraits-page"],
			[data-barba-namespace="books-page"]
		)
		.heart-slideshow-container {
		margin: 0;
		width: 100%;
		overflow: hidden;
	}
	#primary-container:is(
			[data-barba-namespace="portraits-page"],
			[data-barba-namespace="books-page"]
		)
		.heart-slideshow-container
		.heart-slideshow
		button {
		display: none;
	}
	#primary-container:is(
			[data-barba-namespace="portraits-page"],
			[data-barba-namespace="books-page"]
		)
		.heart-slideshow-container
		.heart-slideshow {
		position: fixed;
		height: 80vh;
		overflow: scroll;
		z-index: 900;
		scroll-snap-type: y mandatory;
		padding: 2.9rem 1rem 0 9rem;
		padding-top: 0;
	}
	#primary-container:is(
			[data-barba-namespace="portraits-page"],
			[data-barba-namespace="books-page"]
		)
		.heart-slideshow-container
		.heart-slideshow
		.heart-slide {
		scroll-snap-align: center;
		height: 100vh;
		min-height: 100vh;
		display: flex;
		justify-content: center;
		flex-flow: column;
		padding-bottom: 0;
	}
	#primary-container:is(
			[data-barba-namespace="portraits-page"],
			[data-barba-namespace="books-page"]
		)
		.heart-slideshow-container
		.heart-slideshow
		.heart-slide
		figure {
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: flex-start;
		flex-flow: column;
	}
	#primary-container:is(
			[data-barba-namespace="portraits-page"],
			[data-barba-namespace="books-page"]
		)
		.heart-slideshow-container
		.heart-slideshow
		.heart-slide
		img {
		/* height: 100%; */
		height: calc(100vh - 10rem);
		width: 100%;
		object-fit: contain;
		object-position: left bottom;
		/* font-family: "object-fit: contain;"; */
	}
}
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.heart-slideshow-container
	.heart-slideshow
	.heart-slide
	.gallery-item-info {
	margin-bottom: 0;
}

#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow
	button {
	pointer-events: none;
}
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow {
	height: auto;
	padding-top: 0;
	padding-bottom: 3rem;
}
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow
	.heart-slide {
	position: relative;
	overflow: visible;
	height: auto;
	opacity: 1;
}
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.heart-slideshow-container,
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow,
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow
	.heart-slide,
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow
	.heart-slide
	.image-holder,
#primary-container:is(
		[data-barba-namespace="portraits-page"],
		[data-barba-namespace="books-page"]
	)
	.gallery-item
	.heart-slideshow
	.heart-slide
	.image-holder
	img {
	pointer-events: auto;
	background-color: transparent;
}

/* ======================= 
 New Page
 ======================= */
#primary-container[data-barba-namespace="new-page"] {
	background-color: var(--color-green);
}
#primary-container[data-barba-namespace="new-page"] h3 {
	color: #ffffff;
}
#primary-container[data-barba-namespace="new-page"] li,
#primary-container[data-barba-namespace="new-page"] li a {
	color: #aaa7a0;
}
#primary-container[data-barba-namespace="new-page"] li a.intLink:hover {
	color: #fff;
}
#primary-container[data-barba-namespace="new-page"] .website-link:hover {
	color: var(--color-orange);
}

/* ======================= 
 Instagram Page
 ======================= */
#primary-container[data-barba-namespace="instagram-page"] main {
	background-color: #fff;
}
#sb_instagram #sbi_images {
	padding-top: 6px !important;
}
#sb_instagram .sbi_photo {
	height: auto !important;
	/* padding-top: 100%; */
	padding-top: 130%;
	overflow: hidden;
}
#sb_instagram .sbi_photo img {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0 auto;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}
@media screen and (max-width: 800px) {
	#sb_instagram #sbi_images {
		width: 75%;
		grid-template-columns: repeat(2, 1fr) !important;
		margin: 0 auto;
	}
}
@media screen and (max-width: 600px) {
	#sb_instagram #sbi_images {
		width: 65%;
		grid-template-columns: repeat(1, 1fr) !important;
		margin: 0;
	}
}
@media screen and (min-width: 40em) {
	#sb_instagram #sbi_images {
		width: 100%;
		margin: 0;
	}
	#primary-container[data-barba-namespace="instagram-page"] main {
		padding-right: 11rem;
		width: 95%;
		/* max-width: 150vh; */
		max-width: 1800px;
		min-width: 60vw;
	}
	#sb_instagram #sbi_images {
		gap: 10vmin !important;
	}
}
@media screen and (min-aspect-ratio: 7 / 5) {
	#sb_instagram #sbi_images {
		gap: 14vmin !important;
	}
}
@media screen and (min-aspect-ratio: 7 / 5) and (max-height: 700px) {
	#sb_instagram #sbi_images {
		gap: 7vmax !important;
	}
}

#primary-container[data-barba-namespace="instagram-page"] #sbi_images svg {
	display: none !important;
}

/* ======================= 
 Office Page
 ======================= */
#primary-container[data-barba-namespace="office-page"] main {
	padding: 0;
}
@media screen and (max-width: 49.999em) {
	#primary-container[data-barba-namespace="office-page"] main {
		padding: 9.55rem 0 0 0;
	}
	#primary-container[data-barba-namespace="office-page"]
		.the-content-container
		.dyad-video,
	#primary-container[data-barba-namespace="office-page"]
		.the-content-container
		figure {
		margin-bottom: 0.1em;
	}
}

#primary-container[data-barba-namespace="office-page"] .the-content-container {
	margin-bottom: 0;
}

/* ======================= 
 Inquire / Contact Page
 ======================= */
.inquire-page #site-logo a {
	opacity: 1;
}
@media screen and (max-width: 49.999em) {
	#primary-container[data-barba-namespace="inquire-page"].page-inset main {
		padding: 9.55rem 0.25rem 0 0.75rem;
	}
}
/* ======================= 
 Image Loading Style 
 ======================= */
.image-holder img[onload],
.image-holder img[onload].image-loading,
.image-holder img.lazyload,
.fade-in {
	opacity: 0;
	transition: opacity 0.35s ease-out;
}

.image-holder img[onload].image-loaded,
.image-holder img.lazyloaded,
.fade-in.in-view {
	opacity: 1;
}
.fade-in {
	transition: opacity 1.3s ease-out;
}
