/*
Theme Name: Studio Simpatico
Theme URI: http://www.studiosimpati.co/
Description: This custom WordPress theme was designed and developed with love by Studio Simpatico.
Author: Studio Simpatico
Author URI: http://www.studiosimpati.co/
Version: 1.0.0
*/

/***************************************************************************************************************************************************************************************/

/* HTML5 BOILERPLATE MINIFIED */

/***************************************************************************************************************************************************************************************/

*{box-sizing:border-box;}article{display:block}aside{display:block}details{display:block}figcaption{display:block}figure{display:block;margin:0}footer{display:block}header{display:block}hgroup{display:block}nav{display:block}section{display:block}audio{display:inline;}canvas{display:inline;}video{display:inline;}audio:not([controls]){display:none}[hidden]{display:none}html{color:#222;font-family:sans-serif;font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}button{-webkit-appearance:button;color:#222;cursor:pointer;font-family:sans-serif;font-size:100%;line-height:normal;margin:0;overflow:visible;vertical-align:middle}input{color:#222;font-family:sans-serif;font-size:100%;line-height:normal;margin:0;vertical-align:middle}select{color:#222;font-family:sans-serif;font-size:100%;margin:0;vertical-align:middle}textarea{color:#222;font-family:sans-serif;font-size:100%;margin:0;overflow:auto;resize:vertical;vertical-align:top}body{font-size:1em;line-height:1.4;margin:0}::-moz-selection{background:#333;color:#fff;text-shadow:none}::selection{background:#333;color:#fff;text-shadow:none}a{color:#00e}a:hover{color:#06e;outline:0}a:active{outline:0}abbr[title]{border-bottom:1px dotted}b{font-weight:700}strong{font-weight:700}blockquote{margin:1em 40px}dfn{font-style:italic}hr{border:0;border-top:1px solid #ccc;display:block;height:1px;margin:1em 0;padding:0}ins{background:#ff9;color:#000;text-decoration:none}mark{background:#ff0;color:#000;font-style:italic;font-weight:700}pre{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em;white-space:pre-wrap;word-wrap:break-word}code{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em}kbd{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em}samp{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em}q{quotes:none}q:before{content:none}q:after{content:none}small{font-size:85%}sub{bottom:-.25em;font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{font-size:75%;line-height:0;position:relative;top:-.5em;vertical-align:baseline}ul{margin:1em 0;padding:0 0 0 40px}ol{margin:1em 0;padding:0 0 0 40px}dd{margin:0 0 0 40px}nav ul{list-style:none;list-style-image:none;margin:0;padding:0}nav ol{list-style:none;list-style-image:none;margin:0;padding:0}img{border:0;-ms-interpolation-mode:bicubic;vertical-align:middle}svg:not(:root){overflow:hidden}form{margin:0}fieldset{border:0;margin:0;padding:0}label{cursor:pointer}legend{border:0;margin-left:-7px;padding:0;white-space:normal}input[type="button"]{-webkit-appearance:button;cursor:pointer;overflow:visible}input[type="reset"]{-webkit-appearance:button;cursor:pointer;overflow:visible}input[type="submit"]{-webkit-appearance:button;cursor:pointer;overflow:visible}button[disabled]{cursor:default}input[disabled]{cursor:default}input[type="checkbox"]{box-sizing:border-box;height:13px;padding:0;width:13px}input[type="radio"]{box-sizing:border-box;height:13px;padding:0;width:13px}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none}button::-moz-focus-inner{border:0;padding:0}input::-moz-focus-inner{border:0;padding:0}input:invalid{background-color:#f0dddd}textarea:invalid{background-color:#f0dddd}table{border-collapse:collapse;border-spacing:0}td{vertical-align:top}.chromeframe{background:#ccc;color:#000;margin:.2em 0;padding:.2em 0}

/***************************************************************************************************************************************************************************************/

/* BODY STYLES */

/***************************************************************************************************************************************************************************************/

@font-face {
	font-display: swap;
	font-family: 'jouska';
	src: url('fonts/jouska_texture-webfont.woff2') format('woff2'),
		 url('fonts/jouska_texture-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

:root {
	--white: #fff;
	--black: #000;
	--dark-purple: #282037;
	--light-purple: #535AA6;
	--raisin: #1A1523;
	--harvest-gold: #FFA900;
	--harvest-gold-hover: #FF8800;
	--fawn: #FFA956;
	--sky: #85D9FB;
	--azure: #0B6BC3;
	--dark-green: #04241D;
	--ivory: #F3F3EB;
	--off-white: #F6F6F6;
	--body-font: 'ivyepic', Arial, Helvetica, sans-serif;
	--heading-font: 'jouska', Arial, Helvetica, sans-serif;
	--container-width: 90vw;
	--container-max-width: 1600px;
	--container-outer-padding: 50px;
	--container-outer-margin: calc((100vw - var(--container-width)) / 2);
	--viewport-edge: calc((var(--container-outer-margin) + var(--container-outer-padding)) * -1);
	--one-column-width: ((100vw - (2 * (var(--container-outer-margin) + var(--container-outer-padding)))) - (11 * var(--gap))) / 12;
	--gap: 40px;
	--grid: repeat(12, minmax(0,1fr));
	--module-spacing-small: 64px;
	--module-spacing-medium: 80px;
	--module-spacing-large: 120px;
	--module-spacing-xlarge: 160px;
	--text-spacing-xxsmall: 8px;
	--text-spacing-xsmall: 16px;
	--text-spacing-small: 24px;
	--text-spacing-medium: 32px;
	--text-spacing-large: 40px;
	--text-spacing-xlarge: 48px;
	--text-spacing-xxlarge: 56px;
	--autoscroller-gap: 60px;
	--autoscroller-speed: 20s;
	--drop-shadow: drop-shadow(16px 20px 60px rgba(0, 0, 0, 0.15));

	interpolate-size: allow-keywords;
}

html {
	font-size: 100%;
}

body {
	background: var(--off-white);
	color: var(--dark-purple);
	font: 1rem var(--body-font);
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

.svg-inline--fa {
	display: inline-block;
	font-size: inherit;
	height: 1em;
	overflow: visible;
	vertical-align: -0.125em;
}

.svg-inline--fa path {
	fill: currentColor;
}

a {
	text-decoration: none;
	transition: all .25s ease;
}

input[type=submit],
button {
	border-radius: 0;
	font-family: inherit;
	transition: all .25s ease;
}

img,
svg,
iframe,
picture {
	max-width: 100%;
}

img,
svg,
picture {
	height: auto;
}

h1,
.heading-1,
h2,
.heading-2,
h3,
.heading-3,
h4,
.heading-4,
h5,
.heading-5,
h6,
.heading-6 {
	margin: 0;
}

h1,
.heading-1 {
	font: calc(150rem/16)/calc(130/150) var(--heading-font);
	word-spacing: -30px;
}

h2,
.heading-2 {
	font: calc(110rem/16)/calc(114/110) var(--heading-font);
	word-spacing: -22px;
}

h3,
.heading-3 {
	font: calc(92rem/16)/calc(100/92) var(--heading-font);
	word-spacing: -20px;
}

h4,
.heading-4,
.content-styles h2:not([class]) {
	font: 600 calc(38rem/16)/calc(50/38) var(--body-font);
	letter-spacing: .6px;
	word-spacing: unset;
}

h5,
.heading-5 {
	font: 500 calc(32rem/16)/calc(48/32) var(--body-font);
	letter-spacing: .6px;
	word-spacing: unset;
}

h6,
.heading-6 {
	font: 400 calc(28rem/16)/calc(44/28) var(--body-font);
	letter-spacing: .6px;
	word-spacing: unset;
}

p,
ul,
ol {
	font-size: calc(18rem/16);
	letter-spacing: .6px;
	line-height: calc(32/18);
	margin: 0 0 var(--text-spacing-small);
}

p.large,
ul.large,
ol.large,
.large-text p,
.large-text ul,
.large-text ol {
	font-size: calc(22rem/16);
	line-height: calc(38/22);
}

p.small,
ul.small,
ol.small,
.small-text p,
.small-text ul,
.small-text ol,
.story-popup .style-tiktok .embed blockquote p,
.story-popup .style-tiktok .embed a {
	font-size: 1rem;
	letter-spacing: .4px;
	line-height: calc(24/16);
}

p.xsmall,
ul.xsmall,
ol.xsmall,
.xsmall-text p,
.xsmall-text ul,
.xsmall-text ol {
	font-size: calc(14rem/16);
	letter-spacing: .2px;
	line-height: calc(24/14);
}

.eyebrow {
	display: block;
	font: italic 700 calc(24rem/16)/calc(32/24) var(--body-font);
	letter-spacing: 3px;
	text-transform: uppercase;
	word-spacing: initial;
}

.eyebrow.large {
	font-size: calc(30rem/16);
	letter-spacing: 4.2px;
	line-height: calc(36/30);
}

.eyebrow.small {
	font-size: calc(20rem/16);
	line-height: calc(30/20);
}

.meta {
	font: 700 calc(18rem/16)/calc(24/18) var(--body-font);
	letter-spacing: 2.4px;
	text-transform: uppercase;
	word-spacing: unset;
}

blockquote,
blockquote p {
	font-size: calc(28rem/16);
	font-style: italic;
	font-weight: bold;
	letter-spacing: .4px;
	line-height: calc(40/28);
	margin: 0;
	padding: 0;
}

blockquote.small,
blockquote.small p {
	font-size: calc(22rem/16);
	line-height: calc(32/22);
}

header,
section,
footer,
article {
	width: 100%;
}

.container {
	clear: both;
	margin: 0 auto;
	max-width: var(--container-max-width);
	padding: 0 var(--container-outer-padding);
	position: relative;
	width: var(--container-width); /*Based off 1200 Sketch files*/
}

.flex-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.grid {
	display: grid;
	gap: var(--gap);
	grid-template-columns: var(--grid);
}

.accessibility,
.hidden_label > label {
	backface-visibility: hidden;
	left: -999999999px;
	opacity: 0;
	position: absolute;
}

#skip-to-content {
	top: 0;
	pointer-events: none;
	z-index: 9999999;
}

#skip-to-content:focus {
	backface-visibility: visible;
	left: 0;
	opacity: 1;
	pointer-events: auto;
}

.tablet-only,
.mobile-only,
.desktop-tablet-only {
	display: none !important;
}

/*** Carousels ***/

.carousel,
.slick-list,
.slide,
.slick-track {
	height: 100%;
}

/*** Buttons ***/

.btn {
	color: var(--dark-purple);
	display: inline-block;
	font-weight: 600;
	letter-spacing: 1px;
	line-height: 1;
}

.btn:hover {
	color: var(--dark-purple);
}

/* Primary */

.btn.primary {
	background: var(--harvest-gold);
	border-radius: 60px;
	font-size: calc(22rem/16);
	padding: 27px var(--module-spacing-small);
}

.btn.primary.small {
	font-size: 1rem;
	line-height: calc(24/16);
	padding: var(--text-spacing-xsmall) var(--text-spacing-large)
}

.btn.primary:hover,
.btn.secondary:hover::after,
button:hover .btn.secondary:after,
.btn.icon:hover {
	background-color: var(--harvest-gold-hover);
}

/* Secondary */

.btn.secondary {
	align-items: center;
	display: flex;
	font-size: 1rem;
	gap: var(--text-spacing-xxsmall);
}

.btn.secondary:after {
	background: url('../../plugins/font-awesome-icons/assets/svgs/regular/arrow-right.svg') no-repeat center / auto 14px var(--harvest-gold);
	border-radius: 100%;
	content: '';
	display: block;
	height: var(--text-spacing-medium);
	transition: all .25s ease;
	width: var(--text-spacing-medium);
}

.btn.secondary:hover::after,
button:hover .btn.secondary:after {
	transform: translate3d(4px, 0, 0);
}

/* Icon Btns */

.btn.icon,
.slick-arrow {
	align-items: center;
	background: var(--harvest-gold);
	border-radius: 100%;
	display: flex;
	font-size: 1rem;
	justify-content: center;
	height: var(--module-spacing-small);
	transition: all .25s ease;
	width: var(--module-spacing-small);
}

.btn.icon:hover,
a:hover .btn.icon,
.slick-arrow:hover {
	background: var(--harvest-gold-hover);
	transform: scale(1.1);
}

.btn.icon.small {
	height: 44px;
	width: 44px;
}

.btn.icon.medium,
.slick-arrow {
	font-size: calc(22rem/16);
	height: var(--text-spacing-xxlarge);
	width: var(--text-spacing-xxlarge);
}

.btn.icon.blue {
	background: var(--sky);
}

.btn.icon.dark {
	background: rgb(255 255 255 / .08);
	color: var(--white);
}

/*** Content Styles ***/

.content-styles a:not([class]) {
	color: var(--dark-purple);
	text-decoration: underline;
	text-decoration-color: var(--harvest-gold);
	text-underline-offset: 4px;
	text-decoration-thickness: 1.5px;
}

.content-styles a:not([class]):hover {
	text-decoration-color: var(--harvest-gold-hover);
	text-underline-offset: 2px;
}

.content-styles h2:not([class]),
.content-styles h3:not([class]),
.content-styles h4:not([class]) {
	margin-bottom: var(--text-spacing-xsmall);
}

.content-styles * + h2:not([class]),
.content-styles * + h3:not([class]),
.content-styles * + h4:not([class]) {
	margin-top: var(--module-spacing-medium);
}

/***************************************************************************************************************************************************************************************/

/* HEADER STYLES */

/***************************************************************************************************************************************************************************************/

header {
	margin: 17px 0 -105px;
	position: sticky;
	top: var(--text-spacing-xsmall);
	z-index: 99;
}

header nav,
header #menu-main {
	width: 100%;
}

header nav {
	background: transparent;
	border-radius: 70px;
	margin: 0 auto;
	max-width: max-content;
	padding: var(--text-spacing-xsmall) var(--text-spacing-small) var(--text-spacing-xsmall) var(--text-spacing-xxlarge);
	transition: background .25s ease;
	width: calc(100% - 120px);
}

#menu-main {
	align-items: center;
	display: flex;
	gap: var(--text-spacing-xxlarge);
	justify-content: center;
}

#menu-main a:not([class]) {
	align-items: center;
	color: var(--white);
	display: flex;
	font-size: 1rem;
	font-weight: 600;
	gap: var(--text-spacing-xxsmall);
	letter-spacing: 1.6px;
	line-height: calc(24rem/16);
}

#menu-main a:not([class]):hover {
	color: rgb(255 255 255 / .7);
}

#menu-main a[href^="#"]:not([class]):after {
	background: url('../../plugins/font-awesome-icons/assets/svgs/regular/arrow-down.svg') no-repeat center / auto 13px rgb(0 0 0 / .12);
	border-radius: 100%;
	content: '';
	display: block;
	filter: invert(100%);
	height: 28px;
	transition: background .25s ease;
	width: 28px;
}

#menu-main a[href^="#"]:not([class]):hover::after {
	background-color: rgb(0 0 0 / .20);
}

/* Sticky */

header.super-sticky nav {
	background: var(--raisin);
}

/***************************************************************************************************************************************************************************************/

/* FOOTER STYLES */

/***************************************************************************************************************************************************************************************/

footer {
	background: url('images/bkg-noise-raisin.jpg') repeat center var(--dark-purple);
	color: var(--white);
	padding: var(--module-spacing-small) 0;
	text-align: center;
}

footer article {
	grid-column: 2 / span 10;
}

footer p {
	margin: 0;
}

footer .content-styles a:not([class]) {
	color: var(--white);
}

/***************************************************************************************************************************************************************************************/

/* DEFAULT PAGE STYLES */

/***************************************************************************************************************************************************************************************/

.alignleft {
	float: left;
	margin-right: 15px;
}

.alignright {
	float: right;
	margin-left: 15px;
}

.aligncenter {
	display: block;
	margin: 0 auto 20px;
}

.alignnone {
	display: block;
	margin: 0 0 20px;
}

.wp-caption {
	max-width: 100%;
}

.page-content {
	padding: var(--module-spacing-large) 0;
}

.page-content article {
	grid-column: 3 / span 8;
}

.page-content article h1 {
	margin-bottom: var(--text-spacing-small);
}

/** 404 Page ***/

.error404 .page-content article {
	text-align: center;
}

.error404 .page-content p.heading-6 {
	margin-bottom: var(--text-spacing-large);
}

/***************************************************************************************************************************************************************************************/

/* HOME STYLES */

/***************************************************************************************************************************************************************************************/

/*** Hero ***/

.hero {
	background: url('images/bkg-noise-purple.jpg') repeat center var(--dark-purple);
	color: var(--white);
	height: 100dvh;
	min-height: 1200px;
	overflow: clip;
	padding: 240px 0 157px;
	position: relative;
}

.hero .container {
	align-items: center;
	height: 100%;
}

.hero .grid {
	row-gap: 0;
}

.hero .media {
	align-self: end;
	grid-column: span 5;
	position: relative;
	width: calc(100% + var(--gap));
	z-index: 2;
}

.hero .textures {
	aspect-ratio: 1;
	background: url('images/bkg-noise-purple.jpg') repeat center var(--dark-purple);
	transform: translate3d(0,0,0);
	width: calc(1756/487 * 100%);
	z-index: -1;
}

.hero .textures,
.hero .hero-glow,
.hero .hero-splash,
.hero .hero-spinning {
	left: 50%;
	max-width: none;
	position: absolute;
	transform: translate(-50%,-50%);
	top: 50%;
}

.hero .hero-glow {
	mix-blend-mode: darken;
	width: 100%;
}

.hero .hero-splash {
	mix-blend-mode: darken;
	width: calc(1349/1756 * 100%);
}

.hero .hero-spinning {
	aspect-ratio: 843/825;
	mix-blend-mode: color-dodge;
	width: calc(843/1756 * 100%);
}

.hero .media img {
	width: 100%;
}

.hero h1 {
	color: var(--harvest-gold);
	grid-column: 1 / -1;
	left: var(--container-outer-padding);
	padding-left: calc(356/1196 * 100%);
	position: relative;
	transform: rotate(-8deg) translate3d(0,0,0);
	z-index: 3;
}

.hero h1 .eyebrow {
	left: calc(160/1996 * 100%);
	position: absolute;
}

.hero h1:after {
	aspect-ratio: 839/461;
	background: url('images/hero-heading.png') no-repeat left top / 100% auto;
	content: '';
	position: absolute;
	right: 40px;
	top: -100px;
	transform: rotate(8deg) translate3d(0,0,0);
	width: calc(839/1196 * 100%);
}

.hero p {
	align-self: center;
	color: var(--white);
	grid-column: span 7;
	margin-top: 280px;
	padding-left: var(--text-spacing-large);
	position: relative;
	transform: translate3d(0,0,0);
	z-index: 2;
}

.hero p span {
	color: var(--sky);
	font-style: italic;
	font-weight: bold;
}

/*** Inline Video ***/

.inline-video {
	margin-top: -180px;
	position: relative;
	z-index: 2;
}

.inline-video .play-video,
.inline-video img,
.inline-video video,
.inline-video iframe {
	aspect-ratio: 16/9;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.inline-video .play-video {
	align-items: center;
	border: none;
	color: var(--white);
	display: flex;
	gap: var(--text-spacing-medium);
	justify-content: center;
	left: var(--container-outer-padding);
	padding: 0;
	position: absolute;
	top: 0;
	width: calc(100% - (var(--container-outer-padding) * 2));
	z-index: 2;
}

.inline-video .play-video:before {
	background: var(--black);
	bottom: 0;
	content: '';
	height: 100%;
	left: 0;
	opacity: .6;
	position: absolute;
	width: 100%;
}

.inline-video .play-video .eyebrow {
	font-style: normal;
	opacity: 0;
	position: relative;
	transition: opacity .25s ease;
	z-index: 2;
}

.inline-video button:hover .eyebrow {
	opacity: 1;
}

.inline-video button circle {
	transition: fill .25s ease;
}

.inline-video button:hover circle {
	fill: var(--harvest-gold-hover);
}

.inline-video .btn-play {
	height: 150px;
	mix-blend-mode: screen;
	transition: all .25s ease;
	width: 150px;
}

.inline-video button:hover .btn-play {
	transform: scale(1.1);
}

.inline-video video,
.inline-video iframe {
	background: var(--black);
	display: block;
}

/*** Carousel Intro ***/

.carousel-intro {
	margin: var(--module-spacing-xlarge) 0 0;
	overflow-x: clip;
}

.carousel-intro h2 {
	margin-bottom: var(--module-spacing-large);
	text-align: center;
}

.carousel-intro .carousel {
	overflow: visible;
}

.carousel-intro .carousel .slick-track {
	display: flex;
	gap: var(--text-spacing-xsmall);
	perspective: 1px;
	transform-style: preserve-3d;
}

.carousel-intro .carousel .slide {
	background: url('images/bkg-polaroid.jpg') repeat var(--ivory);
	filter: var(--drop-shadow);
	padding: var(--text-spacing-xsmall);
	transform: rotate(4deg);
	width: 366px;
}

.carousel-intro .carousel .slide:nth-of-type(even) {
	margin-top: 38px;
	transform: rotate(-3deg);
}

.carousel-intro .carousel .slide img {
	aspect-ratio: 309/242;
	object-fit: cover;
	width: 100%;
}

/*** Submit Story ***/

.submit-story {
	background: url('images/bkg-submit-texture.jpg') repeat var(--black);
	border-left: 20px solid var(--off-white);
	border-right: 20px solid var(--off-white);
	color: var(--white);
	margin-top: -100px;
	overflow: clip;
}

.submit-story .media {
	align-self: end;
	grid-column: span 4;
	margin: 0 50px 0 -50px;
}

.submit-story article {
	grid-column: span 8;
	padding: 271px 0 92px var(--text-spacing-xlarge);
}

.submit-story h2 {
	margin-bottom: var(--text-spacing-xsmall);
}

.submit-story h3 {
	color: var(--harvest-gold);
	margin: var(--text-spacing-large) 0;
}

.submit-story ul.grid {
	line-height: 1;
	list-style: none;
	margin: 0;
	padding: 0;
}

.submit-story ul.grid li {
	background: var(--white);
	color: var(--dark-purple);
	grid-column: span 6;
	padding: var(--text-spacing-medium) var(--module-spacing-small) var(--text-spacing-xxlarge) var(--text-spacing-medium);
	position: relative;
}

.submit-story ul.grid .btn.icon {
	position: absolute;
	right: var(--text-spacing-xsmall);
	top: var(--text-spacing-xsmall);
}

.submit-story ul.grid p {
	margin-bottom: var(--text-spacing-xsmall);
}

.submit-story ul.grid p:last-child {
	margin: 0;
}

/*** Stories ***/

.stories {
	padding: var(--module-spacing-xlarge) 0 var(--module-spacing-large);
}

.stories article {
	grid-column: 2 / span 10;
	text-align: center;
}

.stories h2 {
	margin-bottom: var(--text-spacing-xxsmall);
}

.stories p:last-child {
	margin: 0;
}

.archive-content .grid > form {
	grid-column: 1 / -1;
}

.archive-content.loading {
	pointer-events: none;
}

.archive-content.loading #sidebar-container,
.archive-content.loading [jx-form-results] {
	animation: loading 1s infinite;
}

@keyframes loading {
	0% {
		opacity: 1;
	}
	50% {
		opacity: 0.5;
	}
	100% {
		opacity: 1;
	}
}

.archive-content #open-filters,
.archive-content #close-filters {
	display: none;
}

/* Filters */

.archive-content .filters {
	display: flex;
	gap: var(--text-spacing-small);
	grid-column: 1 / -1;
	justify-content: center;
	margin-bottom: var(--text-spacing-large);
}

.archive-content .filters select {
	appearance: none;
	background: url('images/icon-select.png') no-repeat calc(100% - 15px) center / 34px auto;
	border: 1px solid #D5D5D5;
	border-radius: 60px;
	color: var(--dark-purple);
	font: 600 1rem var(--body-font);
	height: var(--module-spacing-small);
	letter-spacing: 1px;
	padding: 0 var(--module-spacing-small) 0 var(--text-spacing-large);
	width: 300px;
}

/* Results */

.stories #archive-content-form + article {
	grid-column: 1 / -1;
}

.archive-content article [jx-form-results-items] {
	display: grid;
	gap: var(--module-spacing-medium) var(--module-spacing-small);
	grid-template-columns: var(--grid);
	line-height: 1;
	list-style: none;
	margin: 0;
	padding: 0;
}

.archive-content article [jx-form-results-items] li {
	grid-column: span 4;
}

.story-loop {
	background: none;
	border: none;
	color: var(--black);
	display: block;
	padding: 0;
}

.story-loop,
.story-loop article {
	text-align: left;
}

.story-loop .media {
	margin-bottom: var(--text-spacing-medium);
	padding: var(--text-spacing-xxsmall);
	position: relative;
}

.story-loop .media:after,
.story-loop .image-frame:before,
.story-loop .image-frame:after,
.story-loop .image:before {
	bottom: 0;
	content: '';
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	transition: opacity .25s ease;
	width: 100%;
}

.story-loop:hover .media:after,
.story-loop:hover .image-frame:before,
.story-loop:hover .image-frame:after,
.story-loop:hover .image:before,
.story-loop:hover .media .rollover {
	opacity: 1;
}

.story-loop .media:after {
	background: url('images/frame-roll.png') no-repeat left top / cover;
	mix-blend-mode: multiply;
}

.story-loop .image-frame {
	position: relative;
}

.story-loop .image-frame:before {
	background: url('images/halftone.png') no-repeat center / cover;
	z-index: 3;
}

.story-loop .image-frame:after {
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, var(--black) 100%);
	height: 45%;
}

.story-loop .image:before {
	background: var(--fawn);
	mix-blend-mode: overlay;
	bottom: 0;
	content: '';
	height: 100%;
	left: 0;
	position: absolute;
	width: 100%;
	z-index: 2;
}

.story-loop .media img {
	aspect-ratio: 335/251;
	object-fit: cover;
	transition: filter .25s ease;
	width: 100%;
}

.story-loop:hover .media img {
	filter: saturate(0);
}

.story-loop .media .btn {
	bottom: 28px;
	font-size: calc(20rem/16);
	left: 30px;
	padding-left: 2px;
	position: absolute;
	z-index: 4;
}

.story-loop:hover .media .btn {
	background-color: var(--white);
	transform: none;
}

.story-loop .media .rollover {
	bottom: 46px;
	color: var(--white);
	font: 700 calc(15rem/16)/calc(24/15) var(--body-font);
	letter-spacing: 2.4px;
	text-transform: uppercase;
	left: 106px;
	opacity: 0;
	position: absolute;
	transition: opacity .25s ease;
	z-index: 4;
}

.story-loop blockquote {
	margin-bottom: var(--text-spacing-xxsmall);
	position: relative;
}

.story-loop .btn.secondary {
	display: flex;
	margin-top: var(--text-spacing-small);
	width: max-content;
}

.story-loop.type-plain blockquote:before {
	background: url('svgs/icon-quote.svg') no-repeat left top / 100% auto;
	content: '';
	display: block;
	height: var(--text-spacing-xxlarge);
	margin-bottom: 10px;
	width: var(--text-spacing-xxlarge);
}

.story-loop blockquote.small:before {
	content: '“';
	display: block;
	left: -15px;
	position: absolute;
	top: 0;
}

/* Pagination */

.archive-content .btn.primary {
	margin: var(--module-spacing-medium) 0 0;
}

.archive-content .btn.primary.load-more-complete {
	display: none;
}

/*** Popups ***/

dialog:modal {
	max-height: 100dvh;
    max-width: 100vw;
}

.story-popup {
	background: url('svgs/bkg-noise-black.svg') var(--black);
	border: none;
	color: var(--white);
	height: 100dvh;
	inset-inline-start: unset;
	left: 0;
	margin: 0;
	overflow: auto;
	padding: 0;
	position: fixed;
	top: 0;
	width: 100vw;
	z-index: 9999;
}

.story-popup .close-popup {
	background: none;
	border: none;
	color: var(--white);
	font-size: calc(24rem/16);
	padding: 0;
	position: fixed;
	right: var(--text-spacing-medium);
	top: var(--text-spacing-medium);
	z-index: 2;
}

.story-popup .close-popup:hover {
	background-color: rgb(255 255 255 / .2);
}

.story-popup .container,
.story-popup .grid:not(:has(.style-image-text.media)) {
	height: 100%;
}

.story-popup .grid {
	row-gap: 0;
}

.story-popup .embed {
	position: relative;
}

.story-popup .embed:before,
.story-popup .embed:after {
	content: '';
	opacity: .5;
	position: absolute;
}

.story-popup .embed:before {
	left: -26px;
	top: -26px;
}

.story-popup .embed:after {
	bottom: -26px;
	right: -26px;
}

/* Plain */

.story-popup .style-plain {
	grid-column: 3 / span 8;
	padding: 136px 0 var(--module-spacing-medium);
}

.story-popup h2:not([class]) strong {
	color: var(--sky);
	font-weight: 600;
}

/* Image + Text */

.story-popup .style-image-text.media {
	align-self: start;
	grid-column: span 5;
	margin: var(--module-spacing-large) 42px 0 -42px;
	position: sticky;
	top: var(--module-spacing-large);
	width: calc(100% + 42px);
}

.story-popup .style-image-text.media:before {
	background: url('images/frame-top.png') no-repeat center / 100% auto;
	height: 171px;
	width: 377px;
}

.story-popup .style-image-text.media:after {
	background: url('images/frame-bottom.png') no-repeat center / 100% auto;
	height: 161px;
	width: 397px;
}

.story-popup .style-image-text.media .single-carousel {
	overflow: clip;
}

.story-popup .style-image-text.media .slick-track {
	display: flex;
}

.story-popup .style-image-text.media img {
	aspect-ratio: 517/624;
	object-fit: cover;
	width: 100%:
}

.story-popup .style-image-text.media .slick-arrow {
	background: transparent;
	border: 1px solid var(--harvest-gold);
	left: 0;
	position: absolute;
	top: calc(100% + var(--text-spacing-large));
}

.story-popup .style-image-text.media .slick-arrow.slick-next {
	left: calc(var(--text-spacing-xxlarge) + var(--text-spacing-small));
}

.story-popup .style-image-text.media .slick-arrow:hover {
	background: var(--harvest-gold);
}

.story-popup .style-image-text.media .slick-arrow svg {
	height: var(--text-spacing-small);
	width: auto;
}

.story-popup article.style-image-text {
	grid-column: span 7;
	padding: 136px 0 0 var(--text-spacing-large);
}

/* Youtube */

.story-popup .style-youtube,
.story-popup .style-soundcloud {
	align-self: center;
	grid-column: 2 / span 10;
}

.story-popup .style-youtube .embed:before,
.story-popup .style-soundcloud .embed:before {
	background: url('images/frame-top-youtube.png') no-repeat left top / 100% auto;
	height: 171px;
	width: 474px;
}

.story-popup .style-youtube .embed:after,
.story-popup .style-soundcloud .embed:after {
	background: url('images/frame-bottom-youtube.png') no-repeat right bottom / 100% auto;
	height: 162px;
	width: 483px;
}

.story-popup .style-youtube iframe {
	aspect-ratio: 16 / 9;
	display: block;
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.story-popup .style-youtube p,
.story-popup .style-soundcloud p,
.story-popup .style-instagram p {
	margin: var(--text-spacing-medium) 0 0;
}

/* Tiktok */

.story-popup .style-tiktok {
	display: grid;
	gap: var(--gap);
	grid-template-columns: var(--grid);
	grid-column: 1 / -1;
	position: relative;
}

.story-popup .style-tiktok:before {
	background: var(--white);
	content: '';
	height: 100%;
	left: var(--viewport-edge);
	position: absolute;
	top: 0;
	width: calc(var(--container-outer-margin) + var(--container-outer-padding) + (var(--gap) * 5) + (var(--one-column-width) * 6));
	z-index: -1;
}

.story-popup .style-tiktok .embed {
	align-self: center;
	grid-column: span 5;
	padding: 0 var(--text-spacing-xlarge);
	z-index: 2;
}

.story-popup .style-tiktok .embed:before,
.story-popup .style-instagram .embed:before {
	background: url('images/frame-top-tiktok.png') no-repeat center / 100% auto;
	height: 345px;
	left: auto;
	right: 20px;
	width: 171px;
}

.story-popup .style-tiktok .embed:after,
.story-popup .style-instagram .embed:after {
	background: url('images/frame-bottom-tiktok.png') no-repeat center / 100% auto;
	height: 345px;
	left: 20px;
	right: auto;
	width: 171px;
}

.story-popup .style-tiktok .embed blockquote,
.story-popup .style-instagram .embed blockquote {
	margin: 0;
	max-width: 100% !important;
	min-width: 0 !important;
}

.story-popup .style-tiktok .embed blockquote p,
.story-popup .style-tiktok .embed a {
	font-style: normal;
	font-weight: normal;
}

.story-popup .style-tiktok .embed + p {
	align-self: center;
	grid-column: 7 / span 6;
	margin: 0;
	padding-left: var(--text-spacing-xxlarge);
}

/* Soundcloud */

.story-popup .style-soundcloud .embed > div {
	display: none;
}

/* Instagram */

.story-popup .style-instagram {
	align-self: center;
	grid-column: 4 / span 6;
	margin: 0 auto;
	padding: 0 var(--text-spacing-xlarge);
	width: calc(100% - var(--text-spacing-xxlarge) * 2);
}

.story-popup .style-instagram .embed:before {
	right: -26px;
}

.story-popup .style-instagram .embed:after {
	left: -26px;
}

/*** Get Support ***/

.support {
	background: url('images/bkg-polaroid.jpg') repeat var(--ivory);
	padding: var(--module-spacing-large) 0;
}

.support h2 {
	left: var(--container-outer-padding);
	position: absolute;
	transform: rotate(-5deg);
	top: 0;
}

.support h2 .eyebrow {
	color: var(--light-purple);
	margin-bottom: var(--text-spacing-small);
}

.support article {
	grid-column: 6 / span 7;
	margin-top: 219px;
}

.support p {
	margin: 0;
}

.support ul {
	display: flex;
	flex-direction: column;
	gap: var(--text-spacing-medium);
	grid-column: 1 / -1;
	line-height: 1;
	list-style: none;
	margin: 29px 0 0;
	padding: 0;
}

.support li {
	border-bottom: 1px solid rgb(0 0 0 / .15);
	padding-bottom: var(--text-spacing-medium);
}

.support li a {
	color: var(--black);
}

.support li h3 {
	font-weight: bold;
	width: calc(435/1196 * 100%);
}

.support li p {
	padding-top: 4px;
	width: calc(553/1196 * 100%);
}

.support li .btn {
	align-items: self;
	flex-shrink: 0;
}

/*** Amplify Stories ***/

.amplify-stories {
	padding-top: var(--module-spacing-large);
}

.amplify-stories .media {
	grid-column: span 4;
	left: calc( var(--module-spacing-large) * -1);
	position: relative;
	width: calc(100% + var(--module-spacing-large));
}

.amplify-stories .media .image {
	background: url('images/bkg-polaroid.jpg') repeat var(--ivory);
	filter: var(--drop-shadow);
	padding: var(--text-spacing-small);
}

.amplify-stories .media .image img {
	aspect-ratio: 4/3;
	object-fit: cover;
	width: 100%;
}

.amplify-stories .media .image:not(:first-child) {
	position: absolute;
}

.amplify-stories .media .image:nth-of-type(1) {
	transform: rotate(-3deg);
}

.amplify-stories .media .image:nth-of-type(2) {
	top: 92px;
}

.amplify-stories .media .image:nth-of-type(3) {
	top: var(--module-spacing-xlarge);
}

.amplify-stories .media .imag img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.amplify-stories article {
	grid-column: 6 / span 7;
}

.amplify-stories h2 {
	margin-bottom: var(--text-spacing-xxsmall);
}

.amplify-stories h2 .eyebrow {
	color: var(--light-purple);
	margin-bottom: var(--text-spacing-xsmall);
}

.amplify-stories .btn {
	margin-top: var(--text-spacing-xsmall);
}

/* Cityscape */

.amplify-stories .cityspace {
	margin-top: var(--module-spacing-xlarge);
	overflow: clip;
	position: relative;
}

.amplify-stories .cityspace img {
	width: 100%;
}

.amplify-stories .cityspace img:not(:last-child) {
	bottom: 0;
	left: 0;
	position: absolute;
}

.amplify-stories .cityspace img:last-child {
	position: relative;
	z-index: 2;
}

/*** Donate ***/

#donate-popup {
	border: none;
	padding: var(--text-spacing-xsmall);
	overflow: visible;
}

#donate-popup::backdrop {
	background: url('svgs/bkg-noise-black.svg') var(--black);
	border: none;
	color: var(--white);
	height: 100dvh;
	inset-inline-start: unset;
	left: 0;
	margin: 0;
	overflow: auto;
	padding: 0;
	position: fixed;
	top: 0;
	width: 100vw;
	z-index: 9999;
}

#donate-popup .close-dialog {
	position: absolute;
	top: 0;
	right: 0;
	padding: var(--text-spacing-xxsmall);
}

#donate-popup .close-dialog button {
	border: none;
	margin-left: auto;
}

#donate-popup iframe {
	border: none;
	min-height: 100%;
	min-width: 100%;
}

/***************************************************************************************************************************************************************************************/

/* MQ MIN-WIDTH 1778 (1778 is when the container width is ~1600) */

/***************************************************************************************************************************************************************************************/

@media only screen and (min-width: calc(1778rem/16)) {

	:root {
		--container-width: var(--container-max-width);
		--one-column-width: 88px;
	}

}

/***************************************************************************************************************************************************************************************/

/* MQ MAX-WIDTH 1400 - Smaller Desktop Sizes */

/***************************************************************************************************************************************************************************************/

@media only screen and (max-width: calc(1400rem/16)) {

	:root {
		--container-width: 100%;
		--container-outer-margin: 0px;
	}

	/*** Hero ***/

	.hero {
		padding-top: 140px;
	}

	.hero h1 {
		top: 85px;
	}

	/*** Stories ***/

	.story-popup .style-image-text.media {
		margin: 0;
		width: 100%;
	}

	.story-popup article.style-image-text {
		padding-left: 0;
	}

	/*** Amplify ***/

	.amplify-stories .media {
		grid-column: span 5;
		left: 0;
		width: 100%;
	}

}

/***************************************************************************************************************************************************************************************/

/* MQ MAX-WIDTH 1200 - Smaller Desktop Sizes / Larger Tablet Sizes */

/***************************************************************************************************************************************************************************************/

@media only screen and (max-width: calc(1200rem/16)) {

	:root {
		--container-outer-padding: 40px;
	}

	.desktop-tablet-only {
		display: block !important;
	}

	/*** Header ***/

	header.flex-container {
		display: none;
	}

	/*** Hero ***/

	.hero h1,
	.hero p,
	.hero .btn,
	.hero .media {
		grid-column: 1 / -1;
	}

	.hero {
		height: unset;
		min-height: 0;
		padding-top: var(--module-spacing-medium);
		text-align: center;
	}

	.hero .grid {
		gap: 0;
	}

	.hero h1 {
		padding: 0;
		position: static;
		text-align: center;
		top: 0;
		transform: none;
	}

	.hero h1 .eyebrow {
		position: static;
	}

	.hero h1:after {
		aspect-ratio: 688/499;
		background-image: url('images/hero-heading-tablet.png');
		display: block;
		margin: 4px auto 0;
		max-width: 100%;
		position: static;
		transform: none;
		width: 688px;
	}

	.hero p {
		margin-top: var(--text-spacing-small);
		padding: 0;
		z-index: 4;
	}

	.hero .btn {
		margin: var(--text-spacing-small) auto 0;
		position: relative;
		width: max-content;
		z-index: 3;
	}

	.hero .media {
		margin: var(--text-spacing-large) auto 0;
		max-width: 350px;
		width: 100%;
		order: 2;
	}

	/*** Submit Story ***/

	.submit-story {
		border: none;
	}

	.submit-story .media {
		display: none;
	}

	.submit-story article {
		grid-column: 1 / -1;
		padding: 150px 0 var(--text-spacing-xxlarge);
	}

	/*** Stories ***/

	.stories #archive-content-form + article {
		grid-column: 1 / -1;
	}

	.archive-content article [jx-form-results-items] {
		gap: var(--text-spacing-xxlarge) var(--gap);
	}

	.story-loop .media::after,
	.story-loop .image-frame::before,
	.story-loop .image::before {
		display: none;
	}

	.story-loop .media {
		margin-bottom: var(--text-spacing-small);
		padding: 0;
	}

	.story-loop .media .rollover,
	.story-loop .image-frame::after {
		opacity: 1;
	}

	.story-loop:hover .media img {
		filter: none;
	}

	.story-popup .style-tiktok .embed,
	.story-popup .style-instagram {
		padding: 0;
	}

	.story-popup .style-tiktok .embed::before {
		right: -26px;
	}

	.story-popup .style-tiktok .embed::after {
		left: -26px;
	}

	/*** Amplify ***/

	.amplify-stories .cityspace {
		margin-top: var(--text-spacing-large);
	}

}

/***************************************************************************************************************************************************************************************/

/* MQ MAX-WIDTH 950 - Tablet Sizes */

/***************************************************************************************************************************************************************************************/

@media only screen and (max-width: calc(950rem/16)) {

	:root {
		--module-spacing-medium: 64px;
		--module-spacing-large: 100px;
		--module-spacing-xlarge: 120px;
	}

	.tablet-only {
		display: block !important;
	}

	.desktop-only {
		display: none !important;
	}

	h1,
	.heading-1 {
		font-size: calc(76rem/16);
		line-height: calc(74/76);
	}

	h2,
	.heading-2 {
		font-size: calc(62rem/16);
		line-height: calc(64/62)
	}

	h3,
	.heading-3 {
		font-size: calc(46rem/16);
		line-height: calc(62/46);
	}

	h5,
	.heading-5,
	.content-styles h2:not([class]) {
		font-size: calc(24rem/16);
		line-height: calc(36/24);
	}

	h6,
	.heading-6 {
		font-size: calc(20rem/16);
		line-height: calc(34/20);
	}

	p,
	ul,
	ol {
		font-size: 1rem;
		line-height: calc(28/18);
	}

	p.large,
	ul.large,
	ol.large,
	.large-text > p,
	.large-text ul,
	.large-text ol {
		font-size: calc(18rem/16);
		line-height: calc(32/18);
	}

	.eyebrow,
	.eyebrow.large {
		font-size: calc(20rem/16);
		line-height: calc(36/20);
	}

	.meta {
		font-size: calc(15rem/16);
		line-height: calc(20/15);
	}

	blockquote,
	blockquote p {
		font-size: calc(20rem/16);
		line-height: calc(32/20);
	}

	blockquote.small,
	blockquote.small p {
		font-size: calc(18rem/16);
		line-height: calc(28/18);
	}

	/*** Stories ***/

	.archive-content article {
		grid-column: 1 / -1;
	}

	.archive-content .filters {
		margin-bottom: var(--text-spacing-small);
	}

	.archive-content article [jx-form-results-items] li {
		grid-column: span 6;
	}

	.story-popup .style-tiktok {
		align-self: center;
	}

	.story-popup .style-tiktok::before {
		display: none;
	}

	.story-popup .style-tiktok .embed,
	.story-popup .style-tiktok .embed + p,
	.story-popup .style-youtube,
	.story-popup .style-soundcloud,
	.story-popup .style-instagram {
		grid-column: 1 / -1;
		width: 100%;
	}

	.story-popup .style-tiktok .embed {
		align-self: start;
		background: var(--white);
	}

	.story-popup .style-tiktok .embed + p {
		align-self: start;
		padding: 0;
	}

	.story-popup .style-instagram {
		width: 100%;
	}

	.story-popup .style-plain {
		grid-column: 1 / -1;
	}

	.story-popup article.style-image-text {
		padding-top: var(--module-spacing-large);
	}

	/*** Support ***/

	.support h2,
	.support article {
		grid-column: 1 / -1;
	}

	.support h2 {
		position: static;
	}

	.support article {
		margin-top: 0;
	}

	/*** Amplify ***/

	.amplify-stories .media .image {
		padding: 14px;
	}

}

/***************************************************************************************************************************************************************************************/

/* MQ MAX-WIDTH 650 - Mobile Sizes */

/***************************************************************************************************************************************************************************************/

@media only screen and (max-width: calc(650rem/16)) {

	:root {
		--container-outer-padding: 20px;
		--grid: 1fr;
		--module-spacing-large: 64px;
		--module-spacing-xlarge: 80px;
	}

	.mobile-only {
		display: block !important;
	}

	/*** Footer ***/

	footer {
		padding: var(--text-spacing-xxlarge) 0;
	}

	footer article {
		grid-column: 1;
	}

	/*** Hero ***/

	.hero {
		padding: 80px 0 90px;
	}

	.hero h1::after {
		aspect-ratio: 277/379;
		background-image: url('images/hero-heading-mobile.png');
		width: 277px;
	}

	.hero p {
		margin-top: var(--text-spacing-xxsmall);
	}

	/*** Inline Video ***/

	.inline-video {
		margin-top: -90px;
	}

	.inline-video .btn-play {
		height: var(--module-spacing-xlarge);
		width: var(--module-spacing-xlarge);
	}

	.inline-video .play-video .eyebrow {
		display: none;
	}

	/*** Carousel Intro ***/

	.carousel-intro h2 {
		margin-bottom: var(--module-spacing-xlarge);
	}

	.carousel-intro .carousel .slick-track {
		gap: var(--text-spacing-xxsmall);
	}

	.carousel-intro .carousel .slide {
		padding: 10px;
		width: 202px;
	}

	/*** Submit Story ***/

	.submit-story h3 {
		margin: var(--text-spacing-medium) 0;
	}

	.submit-story ul.grid {
		gap: 20px;
	}

	.submit-story ul.grid li {
		grid-column: 1;
		padding-bottom: var(--text-spacing-large);
	}

	/*** Stories ***/

	.stories {
		padding-bottom: var(--module-spacing-small);
	}

	.archive-content article [jx-form-results-items] li {
		grid-column: 1;
	}

	.archive-content .filters {
		flex-direction: column;
		gap: var(--text-spacing-xsmall);
	}

	.archive-content .filters select {
		width: 100%;
	}

	.story-loop blockquote.small::before {
		left: -10px;
	}

	.archive-content .btn.primary {
		margin-top: var(--text-spacing-xlarge);
	}

	.story-popup:has(.style-tiktok),
	.story-popup:has(.style-instagram) {
		padding-top: 120px;
	}

	.story-popup:has(.style-instagram) .container,
	.story-popup:has(.style-tiktok) .container {
		height: unset;
	}

	.story-popup .container {
		overflow: clip;
	}

	.story-popup .grid {
		display: flex;
	}

	.story-popup .style-tiktok {
		padding: 0 var(--text-spacing-small);
	}

	.story-popup .style-youtube .embed::before,
	.story-popup .style-soundcloud .embed::before,
	.story-popup .style-youtube .embed::after,
	.story-popup .style-soundcloud .embed::after {
		width: 80%;
	}

	.story-popup .embed::before {
		left: -16px;
	    top: -16px;
	}

	.story-popup .embed::after {
		bottom: -16px;
		right: -16px;
	}

	.story-popup .grid:has(.style-image-text) {
		flex-direction: column;
	}

	.story-popup article.style-image-text,
	.story-popup .style-image-text.media {
		width: 100%;
	}

	.story-popup .style-image-text.media {
		margin: var(--text-spacing-small) 0 120px;
		order: 2;
		position: relative;
		top: 0;
	}

	.story-popup article.style-image-text,
	.story-popup .style-plain {
		padding-top: 106px;
	}

	/*** Support ***/

	.support ul {
		gap: var(--text-spacing-small);
		margin-top: 20px;
	}

	.support li {
		padding-bottom: var(--text-spacing-small);
	}

	.support li a {
		flex-direction: column;
	}

	.support li h3,
	.support li p {
		width: 100%;
	}

	.support li .btn {
		font-size: calc(14rem/16);
		height: var(--text-spacing-xlarge);
		margin-top: var(--text-spacing-xsmall);
		width: var(--text-spacing-xlarge);
	}

	/*** Amplify ***/

	.amplify-stories .media,
	.amplify-stories article {
		grid-column: 1;
	}

	.amplify-stories article {
		text-align: center;
	}

	.amplify-stories .cityspace {
		margin-top: var(--text-spacing-xlarge);
	}

	.amplify-stories .media {
		display: grid;
	}

	.amplify-stories .media .image {
		grid-column: 1;
		grid-row: 1;
	}

	.amplify-stories .media .image:not(:first-child) {
		position: relative;
	}

	.amplify-stories .media .image:nth-of-type(2) {
		margin-top: 36px;
		top: 0;
		transform: rotate(2deg) !important;
	}

	.amplify-stories .media .image:nth-of-type(3) {
		margin-top: 87px;
		top: 0;
		transform: rotate(-2deg) !important;
	}

}

/***************************************************************************************************************************************************************************************/

/* ACCESSIBILITY REDUCE MOTIONS */

/***************************************************************************************************************************************************************************************/

@media (prefers-reduced-motion: no-preference) {

	html {
		scroll-behavior: smooth;
	}

	section {
		scroll-margin-top: 130px;
	}

	/*** LogoGarden Autoscroll ***/

	@keyframes autoscroll {
		0% {
			transform: translateX(var(--autoscroller-gap));
		}
		100% {
			transform: translateX(-100%)
		}
	}

	/*** JazzyScroll Animations ***/

	[data-jazzy-scroll] {
		pointer-events: none;
		transition-duration: .8s;
		transition-property: opacity, transform;
		transition-timing-function: cubic-bezier(0.65, 0, 0.35, 1);
	}

	[data-jazzy-scroll].animated-in {
		pointer-events: all;
	}

	/* All fade ins */

	[data-jazzy-scroll*="fade-in"] {
		opacity: 0;
		transition-property: opacity;
	}

	[data-jazzy-scroll*="fade-in"].animated-in {
		opacity: 1;
	}

	/* Fade in up */

	[data-jazzy-scroll="fade-in-up"] {
		position: relative;
		transform: translate3d(0, 60px, 0);
		transition-property: opacity, transform;
	}

	[data-jazzy-scroll="fade-in-up"].animated-in {
		transform: translate3d(0, 0, 0);
	}

	/*** Header ***/

	header .mobile-menu span:not(.accessibility) {
		transition: .3s;
	}

	/*** Hero Spin ***/

	.hero .hero-spinning {
		animation: spin-me 30s linear infinite;
		transform-origin: center;
	}

	@keyframes spin-me {
		from {
			transform: translate(-50%,-50%) rotate(0);
		}

		to {
			transform: translate(-50%,-50%) rotate(360deg);
		}
	}

	/*** Stories Loop Roll ***/

	.story-loop article {
		transition: transform .25s ease;
	}

	.story-loop:not(.type-plain):hover article {
		transform: translateY(-8px);
	}

}
