/* Occurrence Filter */

	.occurrence-filters .links a {
		color: inherit;
	}

	.occurrence-filters .links img {
		max-height: 3rem;
		margin-left: 1rem;
	}

	.occurrence-filters .controls {
		align-self: flex-end;
		display: flex;
	}

	.occurrence-filters .controls [type="submit"],
	.occurrence-filters .controls a {
		appearance: none;
		border: 1px solid #333;
		color: inherit;
		display: inline-block;
		font-weight: bold;
		height: 3.5rem;
		line-height: 3.5rem;
		margin-right: 1rem;
		padding: 0 2rem;
		text-transform: uppercase;
	}

	.occurrence-filters .controls [type="submit"] {
		background-color: #333;
		color: #fff;
	}

	@media (max-width: 999px) {
		.occurrence-filters {
			background-color: #fff;
			padding: 1.5rem 5%;
			max-width: 500px;
			margin: 0 auto;
			position: relative;
		}

		.occurrence-filters .controls {
			justify-content: center;
			margin-bottom: 2rem;
		}

		.occurrence-filters .links {
			display: none;
		}
	}

	@media (min-width: 1000px) {
		.occurrence-filters {
			align-items: center;
			display: flex;
			padding: 3rem 0;
		}

		.occurrence-filters form {
			display: flex;
		}

		.occurrence-filters .links {
			margin-left: auto;
		}
	}

/* Filter field */

	.filter-field {
		margin-right: 1rem;
	}

	.filter-field > label {
		font-size: 1.5rem;
		letter-spacing: 0.1rem;
		text-transform: uppercase;
	}

	.filter-field > .fieldwrapper {
		border: 1px solid currentColor;
		height: 3.5rem;
		margin-bottom: 2rem;
		width: 100%;
		position: relative;
	}

	.filter-field > .fieldwrapper > ul {
		background-color: #fff;
		bottom: 0;
		box-shadow: 0 0.5rem 0.5rem rgba(0,0,0,0.1);
		left: 0;
		list-style: none;
		margin: 0;
		min-width: 100%;
		padding: 0;
		position: absolute;
		transform: translateY(100%);
		z-index: 1;
	}

	.filter-field > .fieldwrapper label {
		display: block;
		font-weight: normal;
		margin: 0;
		padding: 0.5rem 1rem;
		white-space: nowrap;
	}

	.filter-field > .fieldwrapper label:focus-within,
	.filter-field > .fieldwrapper label:hover {
		background-color: #eaeaea;
	}

	.filter-field select,
	.filter-field input[type="text"],
	.filter-field input[type="date"],
	.filter-field .title {
		border: none;
		padding: 0.5rem 1rem;
		position: absolute;
		width: 100%;
		height: 100%;
	}

	.filter-field input[type="date"] {
		line-height: 1;
	}

	.filter-field > .fieldwrapper .title {
		overflow: hidden;
		padding-right: 4rem;
		text-overflow: ellipsis;
		white-space: nowrap;
		text-align: left;
		background-color: transparent;
		appearance: none;
	}

	.filter-field > .fieldwrapper .title::after {
		content: '\f107';
		font-family: FontAwesome;
		font-size: 2rem;
		position: absolute;
		right: 0;
		text-align: center;
		top: 0;
		width: 4rem;
	}

	.filter-field > .fieldwrapper > ul {
		display: none;
	}

	.filter-field > .fieldwrapper[aria-expanded="true"] > ul {
		display: block;
	}

	.filter-field > .fieldwrapper[aria-expanded="true"] .title {
		background-color: #333;
		color: #fff;
	}

	.filter-field > .fieldwrapper[aria-expanded="true"] .title::after {
		content: '\f106';
	}

	@media (min-width: 1000px) {
		.filter-field > .fieldwrapper {
			margin-bottom: 0;
			width: 18rem;
		}
	}

/* Occurrence List */

	.occurrence-list {
		padding: 2rem 0;
		background-color: #f3f3f3;
	}

	.occurrence-list article > .title {
		font-size: 3.5rem;
		line-height: 1.1;
		margin-bottom: 2rem;
	}

	.occurrence-list article > .title > span {
		color: #6E6E6E;
		display: block;
		font-family: "Rift", "Soleil", "Trebuchet MS", "Helvetica Neue", Arial, sans-serif;
		font-size: 2rem;
		text-transform: uppercase;
	}

	.occurrence-list article:last-child .occurrence-teaser {
		border-bottom: none;
	}

	@media (min-width: 1000px) {
		.occurrence-list {
			padding-top: 4rem;
		}

		.occurrence-list article {
			display: flex;
		}

		.occurrence-list .occurrences {
			flex: 1;
		}

		.occurrence-list article > .title {
			flex-shrink: 0;
			margin-bottom: 0;
			padding: 4rem 3rem 4rem 0;
			width: 18%;
		}
	}

	@media (max-width: 999px) {
		.occurrence-list{
			padding-right: 2rem;
		}

		.occurrence-list img{
			width: 100% !important;
		}
	}

/* Occurrence Teaser */

	.occurrence-teaser {
		border-bottom: 2px solid #ddd;
		margin-bottom: 3rem;
	}

	.occurrence-teaser .image {
		margin-bottom: 3rem;
		margin-right: 3rem;
		width: 150px;
		height: 150px;
	}

	.occurrence-teaser h2 {
		margin-top: 0;
	}

	.occurrence-teaser h2 > a {
		color: #333;
	}

	.occurrence-teaser .content {
		margin-right: 3rem;
		padding-top: 1rem;
	}

	.occurrence-teaser .actions {
		padding: 2rem 0;
	}

	@media (max-width: 999px) {
		.occurrence-teaser .image {
			width: 100%;
		}

		.occurrence-teaser .actions {
			clear: both;
			margin: 0 auto;
			max-width: 300px;
		}
	}

	@media (min-width: 1000px) {
		.occurrence-teaser {
			display: flex;
		}

		.occurrence-teaser .image {
			flex-shrink: 0;
		}

		.occurrence-teaser .actions {
			flex-shrink: 0;
			margin-left: auto;
			width: 18%;
		}
	}

/* Occurrence Calendar */

	.occurrence-calendar {
		background-color: #f3f3f3;
		padding: 3rem 0;
	}

	.occurrence-calendar .pager {
		align-items: center;
		display: flex;
		justify-content: flex-end;
		margin-bottom: 1rem;
	}

	.occurrence-calendar .pager h2 {
		color: inherit;
		font-family: inherit;
		margin: 0 2rem;
	}

	.occurrence-calendar .pager a {
		color: inherit;
		font-size: 2.5rem;
		text-align: center;
	}

	.occurrence-grid {
		border-collapse: separate;
		border-spacing: 0 2rem;
		table-layout: fixed;
		width: 100%;
	}

	.occurrence-grid thead {
		font-size: 1.5rem;
	}

	.occurrence-grid tbody td {
		border-color: #ccc;
		border-style: solid;
		border-width: 0 0 0 3px;
		height: 18rem;
		padding: 0 1.5rem;
		vertical-align: top;
		width: 14.2%; /* 7 columns per row */
	}

	.occurrence-grid tbody td:last-child {
		border-right-width: 3px;
	}

	.occurrence-grid tbody td.othermonth {
		opacity: 0.4;
	}

	.occurrence-grid tbody td .number {
		font-size: 2rem;
	}

	.grid-occurrence {
		color: inherit;
		display: block;
		margin-bottom: 1rem;
	}

	.grid-occurrence .categories span {
		content: '';
		display: inline-block;
		height: 4px;
		margin-right: 0.25rem;
		width: 2rem;
	}

	.grid-occurrence .title {
		display: block;
		font-family: "Rift", "Soleil", "Trebuchet MS", "Helvetica Neue", Arial, sans-serif;
		font-size: 2rem;
		line-height: 1;
		margin-bottom: 0.75rem;
	}

/* Performance detail */

	.performance-banner {
		/* background-position: center top; */ /* Position is set inline */
		aspect-ratio: 16/6;
		background-size: cover;
		background-repeat: no-repeat;
		width: 100%;
	}

	.performance-details .info h1 {
		font-family: "Rift", "Soleil", "Trebuchet MS", "Helvetica Neue", Arial, sans-serif;
		font-size: 7rem;
		margin: 0 0 3rem;
		text-align: right;
	}

	@media (min-width: 1000px) {
		.performance-details {
			display: flex;
		}

		.performance-details section {
			background-color: #fff;
		}

		.performance-details .info {
			padding: 3rem 6% 2rem 3rem;
			transform: translateY(-8rem);
		}

		.performance-details .extra {
			flex: 0 0 40%;
			transform: translateY(-3rem);
		}
		.performance-details.-static .info {
			transform: translateY(0);
		}
		.performance-details.-static .extra {
			transform: translateY(0);
		}
	}

/* Content Accordion */

	.content-accordion [data-toggle="collapse"] {
		border-top: 1px solid #ccc;
		color: inherit;
		display: block;
		font-size: 1.5rem;
		font-weight: bold;
		padding: 1rem;
		text-transform: uppercase;
	}

	.content-accordion .inner {
		padding: 0 1rem;
	}

/* Schedule Tabs */

	.performance-schedule {
		background-color: #f0f0f0;
		padding: 4rem 12% 2rem;
		margin-bottom: 3rem;
	}

	.performance-schedule .tablist {
		border-bottom: 1px solid #ccc;
		border-left: 1px solid #ccc;
		display: flex;
		list-style: none;
		margin: 0;
		padding: 0;
		width: 100%;
	}

	.performance-schedule .tablist > li {
		color: #aaa;
		flex-basis: 100%;
		border-right: 1px solid #ccc;
		transition: background-color 0.3s;
	}

	.performance-schedule .tablist > li.active,
	.performance-schedule .tablist > li:hover,
	.performance-schedule .tablist > li.focus-visible {
		background-color: rgba(0,0,0,0.05);
		color: #333;
	}

	.performance-schedule .tablist a {
		color: inherit;
		display: block;
		font-family: "Rift", "Soleil", "Helvetica Neue", Arial, sans-serif;
		font-size: 2.4rem;
		line-height: 1;
		padding: 1.5rem 20%;
		text-transform: uppercase;
		white-space: nowrap;
	}

	.performance-schedule .tablist a span {
		display: block;
		font-family: "Soleil";
		font-size: 1.25rem;
		font-weight: bold;
	}

/* Table schedule */

	.table-schedule {
		margin-bottom: 3rem;
		table-layout: fixed;
		width: 100%;
	}

	.table-schedule td {
		border-bottom: 1px solid #ccc;
		height: 8rem;
		padding: 1rem;
		width: 50%;
	}

	.table-schedule td:first-child {
		color: #aaa;
		font-size: 1.5rem;
		font-weight: bold;
		line-height: 1;
		text-transform: uppercase;
	}

	.table-schedule td:first-child img {
		margin-left: 0.5rem;
		max-height: 3rem;
	}

	.table-schedule td:last-child {
		font-family: "Rift", "Soleil", "Trebuchet MS", "Helvetica Neue", Arial, sans-serif;
		font-size: 2.5rem;
		line-height: 1;
		text-align: right;
	}

/* Related performances */

	.related-performances {
		/* background-color: #ea5650; */ /* Color set by inline CSS */
		color: #fff;
		padding: 5rem 0;
		position: relative;
	}

	/* Translucent image to create tint effect */
	.related-performances::before {
		background-image: url("../conductor.66611757ce5a.html");
		background-position: center;
		background-size: cover;
		content: '';
		height: 100%;
		left: 0;
		opacity: 0.15;
		position: absolute;
		top: 0;
		width: 100%;
	}

	.related-performances > .container {
		position: relative; /* Move above tint effect */
	}

	.related-performances > .container > h2 {
		color: inherit;
		font-family: 'Soleil', Arial, Helvetica, sans-serif;
		font-weight: normal;
		margin: 0 0 5rem;
		text-align: center;
	}

/* Card slider */

	.card-slider {
		margin-bottom: 5rem;
	}

	.card-slider .frame {
		margin: 0 auto;
		overflow: hidden;
		position: relative;
		width: 80%;
	}

	.card-slider .slides {
		display: flex;
	}

	.card-slider .prev,
	.card-slider .next {
		background: none;
		border: none;
		height: 8rem;
		position: absolute;
		text-align: center;
		top: 50%;
		width: 10%;
	}

	.card-slider .prev {
		left: 0;
	}

	.card-slider .next {
		right: 0;
	}

	.card-slide {
		color: #333;
		display: flex;
		flex-direction: column;
		flex: 0 0 100%;
		padding: 0 1rem;
		white-space: normal;
	}

	.card-slide > img {
		width: 100%;
	}

	.card-slide .content {
		background-color: #fff;
		flex: auto;
		padding: 2rem 3rem 3rem;
	}

	.card-slide h3 {
		color: inherit;
		margin: 0 0 2rem;
		font-size: 3.5rem;
	}

	@media (min-width: 1000px) {
		.card-slide {
			flex: 0 0 33.33%;
			max-width: 33.33%;
		}
	}

/* Section ribbon */

	.section-ribbon {
		/* background-color: #ea5650; */ /* Color set by inline CSS */
		color: #fff;
		padding: 3rem 0 4rem;
	}

	.section-ribbon > .inner {
		margin: 0 auto;
		max-width: 850px;
		width: 90%;
	}

	.section-ribbon > .inner > .title {
		border-bottom: 1px solid currentColor;
		font-size: 5rem;
	}

	@media (max-width: 999px) {
		.section-ribbon {
			text-align: center;
		}
	}

	@media (min-width: 1000px) {
		.section-ribbon {
			padding-top: 5rem;
		}

		.section-ribbon > .inner {
			align-items: center;
			display: flex;
		}

		.section-ribbon > .inner > .title {
			border-bottom: 0;
			border-right: 1px solid currentColor;
			margin-right: 4rem;
			padding: 1rem 4rem 1rem 0;
		}

		.section-ribbon > .inner > .actions {
			flex-shrink: 0;
			margin-left: 4rem;
		}
	}

/* Section spotlight */

	.section-spotlight {
		margin-bottom: 3rem;
	}

	.section-spotlight > .image > img {
		width: 100%;
	}

	.section-spotlight > .content {
		background-color: #f0f0f0;
		padding: 6rem 7rem 5rem;
	}

	.section-spotlight > .content h3 {
		margin-bottom: 2rem;
	}

	.section-spotlight > .content h3 img {
		margin-right: 1rem;
		max-height: 4rem;
	}

	@media (min-width: 1000px) {
		.section-spotlight {
			display: flex;
		}

		.section-spotlight:nth-child(even) {
			flex-direction: row-reverse;
		}

		.section-spotlight > .image {
			display: flex;
			flex: 0 0 48%;
		}
	}
