body.event-template-default.single {

	.site-main {
		padding-bottom: 200px;

		@media screen and (max-width: 1199px) {
			padding-bottom: 100px;
		}

		@media screen and (max-width: 767px) {
			font-size: var(--font-size-md);
		}

		article>div {
			padding-bottom: var(--space-10);

			@media screen and (max-width: 767px) {
				padding-bottom: 16px;
			}
		}

		header {
			margin-top: var(--space-5);

			h1.page-title {
				font-family: var(--font-family-serif);
				font-size: var(--font-size-5xl);
				font-weight: var(--font-weight-heavy);
				line-height: 100%;
				color: var(--color-dark-blue);
				margin-bottom: var(--space-10);
				hyphens: auto;

				@media screen and (max-width: 1199px) {
					font-size: var(--font-size-4xl);
					margin-bottom: var(--space-8);
					margin-top: var(--space-10);
				}

				@media screen and (max-width: 991px) {
					font-size: var(--font-size-3xl);
				}
			}
		}
	}

	.event-meta {
		font-size: var(--font-size-2xl);
		line-height: 140%;
		display: flex;
		flex-direction: row;
		gap: var(--space-5);
		color: var(--color-dark-blue);

		@media screen and (max-width: 767px) {
			font-size: var(--font-size-lg);
			gap: var(--space-3);
		}

		@media (max-width: 576px) {
			font-size: var(--font-size-md);
		}

		div {
			flex-basis: 100%;
		}

		.label {
			font-family: var(--font-family-sans);
			font-weight: var(--font-weight-extra-bold);
		}

		address {
			font-style: normal;
		}
	}

	.event-description {
		margin-top: var(--space-10);
		font-size: var(--font-size-xl);
		line-height: 140%;
		color: var(--color-dark-blue);

		@media screen and (max-width: 767px) {
			font-size: var(--font-size-lg);
			margin-top: var(--space-8);
		}

		@media (max-width: 576px) {
			font-size: var(--font-size-md);
		}
	}

	.image-container {
		padding: 0 4px;

		.image-wrapper {
			img {
				width: 100%;
				height: 500px;
				object-fit: cover;
				max-width: 100vw;

				@media screen and (max-width: 1199px) {
					height: 350px;
				}
			}
		}

	}

}