/* Shared responsive layout for Fest content pages (body/section layer). */

*,
*::before,
*::after {
	box-sizing: border-box;
}

/* City tabs — date/subtitle snug under tab title (all breakpoints) */
.city-tabs ul li div.show-date {
	margin-top: -7px;
}

/* Center white column so Fest side background shows (until ≤450px per feedback) */
/* Use #container > #content — blog also has nested #primary #content (duplicate id) */
@media (min-width: 451px) {
	/* Match prod: #content 999px; #content_holder 969px + 15px side padding (content-box) */
	#container > #content {
		width: 100% !important;
		max-width: 999px !important;
		margin-top: -38px;
		margin-left: auto !important;
		margin-right: auto !important;
		box-sizing: content-box !important;
	}

	#content_holder,
	#white_space {
		width: 100% !important;
		max-width: 969px !important;
		margin-left: auto !important;
		margin-right: auto !important;
		padding-left: 15px !important;
		padding-right: 15px !important;
		box-sizing: content-box !important;
	}

	#middle {
		width: 100%;
	}
}

/* Full-width desktop: exact prod dimensions (999 / 969 content + 15px gutters) */
@media (min-width: 1000px) {
	#container > #content {
		width: 999px !important;
		max-width: 999px !important;
	}

	#content_holder,
	#white_space {
		width: 969px !important;
		max-width: 969px !important;
	}
}

/* Home + city hub two-column (sidebar + shop row) */
.left-content,
.right-sidebar {
	max-width: 100%;
	box-sizing: border-box;
}

/* Home sidebar: black bar titles (BigNoodle ascenders clip at fixed 22px) */
.right-sidebar .bk-title {
	height: auto !important;
	min-height: 22px;
	line-height: 1.15 !important;
	padding: 5px 8px !important;
	box-sizing: border-box;
	overflow: visible;
}

/* Newsletter signup gray header — allow two-line title */
.right-sidebar .sd-email.sd-box > div[style*="background-color:#c7c9cb"],
.right-sidebar .sd-email.sd-box > div[style*="background-color: #c7c9cb"] {
	height: auto !important;
	min-height: 38px;
	line-height: 1.2 !important;
	padding: 6px 8px !important;
	box-sizing: border-box;
}

/* Wimpy audio player — 312×102 shell like production; clip duplicate startup stage */
.right-sidebar .sd-wimpy-player {
	clear: both;
	width: 312px;
	max-width: 100%;
	height: 102px !important;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden !important;
	box-sizing: border-box;
	position: relative;
}

.right-sidebar .sd-wimpy-player > div {
	width: 312px !important;
	min-width: 312px;
	max-width: 100% !important;
	height: 102px !important;
	overflow: hidden !important;
	position: relative;
	margin: 0 auto;
}

.right-sidebar .sd-wimpy-player [id^="Box_JBEEB"] {
	width: 312px !important;
	max-width: 100% !important;
}

/* Hide duplicate startup player if Wimpy injects a second stage */
.right-sidebar .sd-wimpy-player [id^="Stage_JBEEB"] ~ [id^="Stage_JBEEB"],
.right-sidebar .sd-wimpy-player [id^="Box_JBEEB_46"] {
	display: none !important;
}

/* Sidebar ad #3 — sd-email adds top/bottom rules without sd-box */
.right-sidebar .home-sidebar-ad.sd-email {
	border: none !important;
	border-top: none !important;
	border-bottom: none !important;
}

.right-sidebar .home-sidebar-ad img {
	border: none !important;
}

/* Newsletter below player — fixed 118px is too short once header wraps */
.right-sidebar .sd-postman-signup.sd-box {
	height: auto !important;
	min-height: 118px;
	margin-top: 10px;
	clear: both;
}

.right-sidebar iframe {
	max-width: 100%;
}

/*
 * Home (fest-home): tablet 768–991 — Beatles Shop full width on top;
 * sidebar widgets in two columns (50% each). Phone ≤767 — widgets stack one-up.
 */
@media (min-width: 768px) and (max-width: 991.98px) {
	.city-body.home-shop-layout {
		display: flex;
		flex-direction: column;
	}

	.city-body.home-shop-layout > .left-content {
		order: 1;
		width: 100% !important;
		float: none !important;
		max-width: 100%;
	}

	.city-body.home-shop-layout > .right-sidebar {
		order: 2;
		width: 100% !important;
		float: none !important;
		max-width: 100%;
		margin-top: 24px;
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: space-between;
		gap: 16px 12px;
		box-sizing: border-box;
	}

	.city-body.home-shop-layout > .right-sidebar > .sd-email {
		flex: 0 0 calc(50% - 6px);
		width: calc(50% - 6px) !important;
		max-width: calc(50% - 6px);
		box-sizing: border-box;
		margin-top: 0 !important;
	}

	/* Half-column slot — player shell stays 312px (Wimpy breaks if parent is ~470px) */
	.city-body.home-shop-layout > .right-sidebar > .sd-wimpy-player {
		flex: 0 0 calc(50% - 6px);
		width: calc(50% - 6px) !important;
		max-width: calc(50% - 6px);
		box-sizing: border-box;
		margin-top: 0 !important;
		display: flex;
		justify-content: center;
		align-items: flex-start;
		min-width: 0;
		overflow: visible;
	}

	.city-body.home-shop-layout > .right-sidebar > div:not(.sd-email):not(.sd-wimpy-player) {
		display: none;
	}

	/* Facebook + audio — centered in each half-column, no outer box border */
	.city-body.home-shop-layout > .right-sidebar > .home-widget-facebook {
		border: none !important;
		text-align: center;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.city-body.home-shop-layout > .right-sidebar > .home-widget-facebook iframe {
		width: 312px !important;
		max-width: 100%;
		margin: 0 auto;
		display: block;
	}

	.city-body.home-shop-layout > .right-sidebar > .sd-wimpy-player > div {
		width: 312px !important;
		min-width: 312px;
		max-width: 312px;
		flex: 0 0 312px;
		margin-left: auto;
		margin-right: auto;
	}

	/* FEST PHOTOS — one widget (composite or Pods ad #4); keep image centered */
	.city-body.home-shop-layout .home-widget-photos {
		text-align: center;
		overflow: hidden;
	}

	.city-body.home-shop-layout .home-widget-photos a {
		display: block;
		max-width: 100%;
	}

	.city-body.home-shop-layout .home-widget-photos img {
		width: auto !important;
		max-width: 100%;
		height: auto !important;
		margin: 0 auto;
		display: block;
		padding: 10px 0 18px !important;
	}
}

/* Desktop sidebar: no border on Facebook; center audio */
.city-body.home-shop-layout > .right-sidebar > .home-widget-facebook {
	border: none !important;
	text-align: center;
}

.city-body.home-shop-layout > .right-sidebar > .home-widget-facebook iframe {
	margin-left: auto;
	margin-right: auto;
	display: block;
}

.city-body.home-shop-layout > .right-sidebar > .sd-wimpy-player {
	margin-left: auto;
	margin-right: auto;
}

@media (max-width: 767.98px) {
	.city-body.home-shop-layout {
		display: flex;
		flex-direction: column;
	}

	.city-body.home-shop-layout > .left-content {
		order: 1;
		width: 100% !important;
		float: none !important;
	}

	.city-body.home-shop-layout > .right-sidebar {
		order: 2;
		display: block;
		width: 100% !important;
		float: none !important;
		margin-top: 24px;
	}

	.city-body.home-shop-layout > .right-sidebar > .sd-email,
	.city-body.home-shop-layout > .right-sidebar > .sd-wimpy-player {
		width: 100% !important;
		max-width: 100%;
		flex: none;
		margin-top: 10px;
	}

	.city-body.home-shop-layout > .right-sidebar > div:not(.sd-email):not(.sd-wimpy-player) {
		display: none;
	}
}

@media (min-width: 992px) {
	.city-body.home-shop-layout {
		display: block;
	}

	.city-body.home-shop-layout > .left-content {
		float: left;
		width: 636px !important;
	}

	.city-body.home-shop-layout > .right-sidebar {
		display: block;
		float: right;
		width: 312px !important;
		max-width: 312px;
		margin-top: 0;
	}

	.city-body.home-shop-layout > .right-sidebar > div:not(.sd-email):not(.sd-wimpy-player) {
		display: block;
	}
}

@media (max-width: 991.98px) {
	.left-content,
	.right-sidebar {
		width: 100% !important;
		float: none !important;
	}

	.city-body:not(.home-shop-layout) > .left-content,
	.city-body:not(.home-shop-layout) > .right-sidebar {
		display: block;
	}

	ul.shop-prods {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		height: auto !important;
		margin-left: 0 !important;
		padding: 0 8px;
	}

	ul.shop-prods li {
		float: none;
		width: 50% !important;
		max-width: 220px;
		height: auto !important;
		min-height: 320px;
		box-sizing: border-box;
	}

	ul.photo-gallery li {
		float: none;
		width: 100% !important;
		max-width: 320px;
		margin-left: auto !important;
		margin-right: auto !important;
		height: auto !important;
	}
}

@media (max-width: 575.98px) {
	ul.shop-prods li {
		width: 100% !important;
		max-width: 100%;
	}
}

#container > #content img,
#content_holder img,
#primary #content img,
.city-body img,
.act-list img {
	max-width: 100%;
	height: auto;
}

/* Footer + sponsor band (parity with store stylesheet_fest_store_overrides.css) */
#footer-container {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	box-sizing: border-box;
	overflow-x: hidden;
}

#footer-container > div[style*="background-color:#c8c8c8"] > div,
#footer-container > div[style*="background-color:#c8c8c8"] > div[style*="width:969px"] {
	width: 100% !important;
	max-width: 969px;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 18px;
	padding-right: 18px;
	box-sizing: border-box;
}

#footer {
	width: 100% !important;
	max-width: 969px;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
	padding-left: 18px;
	padding-right: 18px;
}

#lg-ls > ul#partnerslogo {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	height: auto;
	width: 100%;
	margin: 0;
	padding: 12px 10px;
	box-sizing: border-box;
}

ul#partnerslogo li {
	float: none;
	flex: 0 1 110px;
	padding: 6px;
	box-sizing: border-box;
}

@media (max-width: 991.98px) {
	#footer {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		gap: 10px 12px;
		padding-top: 12px;
		padding-bottom: 10px;
	}

	#footer #ftop-up-arrow {
		float: none;
		flex: 0 0 auto;
	}

	#footer #footer-menu {
		float: none;
		width: 100%;
		max-width: 100%;
		height: auto;
		margin: 0;
		flex: 1 1 100%;
	}

	#footer #menu-menus,
	#footer .menu-menus-container,
	#footer #menu-menus ul.menu1 {
		float: none;
		width: 100%;
		height: auto;
		margin: 0;
		padding: 0;
	}

	#footer #menu-menus ul.menu1 {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 4px 0;
	}

	#footer #menu-menus li,
	#footer ul.menu1 li {
		float: none;
		width: auto !important;
		flex: 0 1 auto;
	}

	#footer #menu-menus a,
	#footer ul.menu1 a {
		font-size: 18px;
		padding: 4px 10px !important;
	}

	#footer #ft-phone {
		float: none;
		width: 100%;
		max-width: 100%;
		height: auto;
		margin: 0;
		padding: 6px 0;
		font-size: 20px;
		line-height: 1.2;
		border-left: 0;
		border-right: 0;
		text-align: center;
		flex: 1 1 100%;
	}

	#footer #top-header-socials {
		float: none;
		width: 100%;
		height: auto;
		margin: 0 !important;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		gap: 10px;
		flex: 1 1 100%;
	}

	#footer #top-header-socials a img {
		padding-left: 0;
	}

	#footer #pwd-by {
		float: none;
		width: 100%;
		text-align: center;
		flex: 1 1 100%;
	}
}

/* Fest sub-nav: wrap instead of horizontal scroll */
.city-sections {
	height: auto;
	min-height: 38px;
	overflow: visible;
}

.city-sections ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
	width: 100% !important;
	height: auto;
	min-height: 38px;
	margin: 0 auto;
	padding: 0;
	white-space: normal;
	float: none;
}

.city-sections ul li {
	float: none;
	width: auto;
	height: auto;
	min-height: 38px;
	padding: 0 24px;
	flex: 0 1 auto;
}

.city-sections ul li > a {
	display: block;
	line-height: 38px;
	padding: 0 8px;
}

/* Content area side padding (fest pages without tab rails) */
.city-body,
.city-body > div[style*="background-color:#c7c9cb"] {
	padding-left: 18px;
	padding-right: 18px;
}

.city-body > .act-list {
	padding-left: 25px;
	padding-right: 25px;
}

/*
 * Tab rails: vertical borders on .act-list align with .city-tabs / #history-tab
 * at every width — no extra .city-body gutter; pad inside the bordered box.
 */
#content_holder:has(> .city-tabs) .city-body,
#content_holder:has(> #history-tab) .city-body,
#history-tab ~ .city-body,
.city-tabs ~ .city-body,
.city-body:has(#buy-tickets),
.city-body.landing-page {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

#content_holder:has(> .city-tabs) .city-body > .act-list,
#content_holder:has(> #history-tab) .city-body .act-list,
.city-body.landing-page > .act-list {
	padding-left: 18px !important;
	padding-right: 18px !important;
	box-sizing: border-box;
	width: 100%;
}

#content_holder > .city-tabs,
#content_holder > #history-tab {
	width: 100%;
	box-sizing: border-box;
}

.act-row ul {
	display: flex;
	flex-wrap: wrap;
}

.act-row li.act-img,
.act-row li.act-desc {
	float: none;
}

.act-row li.act-desc {
	min-width: 0;
}

li.act-desc > div.act-detail {
	padding-left: 20px;
}

/* Venue / affiliate action buttons */
.venue-map-con,
.act-detail > div[style*="text-align:right"] {
	width: 100% !important;
	max-width: 100%;
	margin: 26px 0 0 0 !important;
	text-align: left !important;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.venue-map-con .fbutton,
.act-detail .fbutton {
	float: none;
}

/* Photo gallery widget */
#tb-gallery,
#fest-galleries,
#tb-gallery .gv_galleryWrap,
#fest-galleries .gv_galleryWrap {
	width: 100% !important;
	max-width: 100%;
}

#tb-gallery .gv_panelWrap,
#tb-gallery .gv_panel,
#tb-gallery .gv_gallery,
#fest-galleries .gv_panelWrap,
#fest-galleries .gv_panel,
#fest-galleries .gv_gallery {
	max-width: 100% !important;
}

#tb-gallery .gv_overlay,
#fest-galleries .gv_overlay {
	max-width: 100% !important;
}

.city-body iframe,
.act-list iframe,
#content_holder iframe {
	max-width: 100%;
}

/* Guest grid (guests-list.php) */
.confirmed-nyc-guest ul {
	display: flex;
	flex-wrap: wrap;
}

.confirmed-nyc-guest ul li {
	float: none;
	box-sizing: border-box;
}

.confirmed-nyc-guest ul li img {
	max-width: 100%;
	height: auto;
}

@media (max-width: 991.98px) {
	.city-tabs ul li div.show-city {
		font-size: 20px;
		margin: 10px 0 0 14px;
	}

	.city-tabs ul li div.show-date {
		margin-left: 14px;
		margin-top: -7px;
	}

	#left,
	#left_not_home,
	.right-sidebar {
		width: 100% !important;
		max-width: 100%;
		float: none;
	}

	.right-sidebar {
		margin-top: 24px;
	}

	#left div.listing div.header,
	#left div.listing div.news_holder div.link_holder,
	#left div.listing div.line div.line_grey,
	#left div.related_articles,
	#left div.share,
	#left div.author div.authorcontent {
		width: 100% !important;
		max-width: 100%;
	}

	#left div.single div.thumb,
	#left div.single div.thumb img {
		width: 100% !important;
		max-width: 100%;
		height: auto;
	}

	.city-body:not(.landing-page) .act-row:not(:has(.history-img)) li.act-img {
		width: 100%;
		margin-bottom: 12px;
	}

	.city-body:not(.landing-page) .act-row:not(:has(.history-img)) li.act-desc {
		width: 100% !important;
		border-left: 0;
		border-top: 1px solid #bfbfbf;
		padding-top: 12px;
	}
}

@media (max-width: 575.98px) {
	.confirmed-nyc-guest ul li,
	.confirmed-nyc-guest ul li.center {
		width: 100% !important;
	}
}

/*
 * Section title bar (guitar + label + banner) — venue, guests, photos, etc.
 * Float layout breaks when #content is fixed 999px (ul drops under guitar). Flex keeps one row.
 */
@media (min-width: 768px) {
	.city-title-bar {
		display: flex;
		align-items: flex-end;
		flex-wrap: nowrap;
		width: 100%;
		height: auto !important;
		min-height: 106px;
		padding-bottom: 10px;
		box-sizing: border-box;
		overflow: visible;
	}

	.city-title-bar > img {
		float: none !important;
		flex: 0 0 auto;
		align-self: center;
		margin: 0;
		padding-top: 16px !important;
		padding-left: 38px !important;
		max-height: 86px;
		width: auto;
		height: auto;
	}

	.city-title-bar ul {
		float: none !important;
		display: flex;
		flex: 1 1 auto;
		align-items: flex-end;
		flex-wrap: nowrap;
		min-width: 0;
		width: auto !important;
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.city-title-bar ul li {
		float: none !important;
		width: auto !important;
		height: auto !important;
		min-height: 0;
		border-left: 0 !important;
		margin: 0 !important;
		text-align: left !important;
	}

	.city-title-bar ul li:first-child {
		flex: 0 0 auto;
		padding-left: 18px !important;
	}

	.city-title-bar ul li:last-child {
		flex: 1 1 auto;
		min-width: 0;
		margin-left: 20px !important;
		padding-left: 0 !important;
		display: flex;
		align-items: flex-end;
		justify-content: flex-start;
	}

	.city-title-bar ul li:last-child img {
		display: block;
		width: auto;
		max-width: min(638px, 100%);
		max-height: 86px;
		height: auto;
		margin: 0;
	}

	.city-title-bar ul li div.show-sec-title {
		padding-top: 38px;
		padding-bottom: 8px;
		white-space: nowrap;
	}
}

/* Phone: stack guitar, section title, and banner (no overlap) */
@media (max-width: 767.98px) {
	.city-title-bar {
		display: block !important;
		height: auto !important;
		margin-top: 10px;
		padding: 10px 0;
	}

	.city-title-bar > img {
		float: none !important;
		display: block;
		margin: 0 auto 10px auto;
		padding: 0 !important;
	}

	.city-title-bar ul {
		float: none !important;
		display: block !important;
		flex: none;
		width: 100%;
	}

	.city-title-bar ul li {
		float: none;
		width: 100% !important;
		height: auto;
		border-left: 0;
		margin: 0 !important;
		padding: 0 12px !important;
		text-align: center !important;
	}

	.city-title-bar ul li div.show-sec-title {
		font-size: 34px;
		padding-top: 12px;
		padding-bottom: 8px;
	}

	.city-title-bar ul li:last-child img {
		margin: 0 auto;
		width: 100%;
		max-width: 638px;
	}

	.city-name-title span {
		padding-left: 16px;
		padding-right: 16px;
	}

	.city-body:not(.landing-page) .act-row:not(:has(.history-img)) li.act-img {
		width: 100%;
		margin-bottom: 12px;
	}

	.city-body:not(.landing-page) .act-row:not(:has(.history-img)) li.act-desc {
		width: 100% !important;
		border-left: 0;
		border-top: 1px solid #bfbfbf;
		padding-top: 12px;
	}

	li.act-desc > div.act-detail {
		padding-left: 20px;
		padding-right: 12px;
	}
}

@media (max-width: 767.98px) {
	#container > #content {
		width: 100% !important;
		max-width: 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#content_holder {
		width: 100% !important;
		max-width: 100% !important;
		padding-left: 12px !important;
		padding-right: 12px !important;
	}

	#left {
		width: 100%;
		float: none;
	}

	.city-body:not(.landing-page) {
		padding-left: 12px;
		padding-right: 12px;
	}

	#content_holder:has(> .city-tabs) .city-body,
	#content_holder:has(> #history-tab) .city-body,
	#history-tab ~ .city-body,
	.city-tabs ~ .city-body,
	.city-body:has(#buy-tickets),
	.city-body.landing-page {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#content_holder:has(> .city-tabs) .city-body > .act-list,
	#content_holder:has(> #history-tab) .city-body .act-list,
	.city-body.landing-page > .act-list {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}

	.city-tabs ul li {
		width: 100% !important;
		border-left: 0 !important;
		height: auto;
		min-height: 56px;
	}

	.city-tabs ul li.first,
	.city-tabs ul li.last {
		width: 100% !important;
	}

	.city-tabs ul li div.show-city {
		font-size: 18px !important;
		line-height: 1.1;
		margin: 8px 0 0 10px;
	}

	.city-tabs ul li div.show-date {
		font-size: 11px;
		margin: -7px 0 8px 10px;
	}

	#history-tab.city-tabs ul li {
		width: 100% !important;
	}

	#history-tab.city-tabs ul li div.show-city {
		font-size: 30px !important;
		line-height: 1.05 !important;
	}

	.city-sections ul li {
		font-size: 13px;
		padding: 0 10px;
	}

	.city-title-bar ul li div.show-sec-title {
		font-size: 28px;
	}

	.city-name-title span {
		font-size: 18px;
		padding-left: 12px;
	}

	.toll-free-phone {
		padding-left: 12px;
		padding-right: 12px;
	}

	.city-sections ul li > a {
		padding: 8px 4px;
		line-height: 1.3;
		min-height: 38px;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.venue-map-con,
	.act-detail > div[style*="text-align:right"] {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* Generic WP pages (help, sponsorship, etc.) */
#page .entry-content,
#page .entry-content img,
#left_no_sidebar .entry-content img {
	max-width: 100%;
	height: auto;
}

#left div.single div.content,
#left div.single div.content a,
#left div.listing div.content,
#page .entry-content,
#primary #content .entry-content,
#primary #content .entry-content a,
#primary #content article {
	overflow-wrap: anywhere;
	word-break: break-word;
	max-width: 100%;
}

#page .entry-content table {
	display: block;
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

#page .entry-content iframe,
#page .entry-content embed,
#page .entry-content object {
	max-width: 100%;
}

/* History / landing sidebar images — “+” zoom in upper-right of image frame */
.history-img p,
.landing-page-img p {
	position: relative;
	display: block;
	width: 238px;
	max-width: 100%;
	margin-right: 0;
	box-sizing: border-box;
}

.history-img p > img:first-of-type,
.landing-page-img p > img:first-of-type {
	display: block;
	width: 100% !important;
	height: auto !important;
	max-width: 238px;
	margin: 0 auto;
}

a.his-pop,
a.landing-pop {
	position: absolute !important;
	top: 4px !important;
	right: 4px !important;
	left: auto !important;
	width: 23px !important;
	height: 23px !important;
	z-index: 298;
}

a.his-pop img,
a.landing-pop img {
	display: block;
	width: 23px !important;
	height: 23px !important;
}

/*
 * /help and landing-page template (landing-page.php) — Ken feedback 2026-05-28
 * Tab-rail alignment: see “Tab rails” block above (.city-body.landing-page).
 */
.landing-page .act-list {
	border-left: 1px solid #c8c8c8;
	border-right: 1px solid #c8c8c8;
}

.landing-page .act-row {
	border-bottom: 0;
}

.landing-page .act-row > ul {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.landing-page .act-row li.act-img.landing-page-img {
	flex: 0 0 238px;
	width: 238px;
	max-width: 38%;
	float: none;
}

.landing-page .act-row li.act-desc {
	flex: 1 1 auto;
	width: auto !important;
	min-width: 0;
	min-height: 0 !important;
	float: none;
	border-left: 1px solid #bfbfbf;
}

.landing-page .share-part {
	clear: both;
	width: 100%;
	margin-right: 0 !important;
	margin-top: 0;
	padding-bottom: 8px;
}

.landing-page .act-share {
	float: none;
	width: auto;
	text-align: left;
}

.landing-page .act-summary {
	margin-right: 0;
}

.landing-page-img > div {
	display: none;
}

/* ≥768: keep image column + text side-by-side; scale images down on narrower desktop */
@media (max-width: 1199.98px) and (min-width: 768px) {
	.landing-page .act-row li.act-img.landing-page-img {
		flex: 0 0 200px;
		width: 200px;
		max-width: 34%;
	}

	.history-img p,
	.landing-page-img p {
		width: 200px;
	}
}

@media (max-width: 1055px) and (min-width: 768px) {
	.landing-page .act-row li.act-img.landing-page-img {
		flex: 0 0 180px;
		width: 180px;
		max-width: 30%;
	}

	.history-img p,
	.landing-page-img p {
		width: 180px;
	}
}

@media (max-width: 991.98px) and (min-width: 768px) {
	.landing-page .act-row > ul {
		flex-wrap: nowrap !important;
	}

	.landing-page .act-row li.act-img.landing-page-img {
		flex: 0 0 160px;
		width: 160px;
		max-width: 28%;
	}

	.history-img p,
	.landing-page-img p {
		width: 160px;
	}

	.landing-page .act-row li.act-desc {
		border-left: 1px solid #bfbfbf;
		border-top: 0;
		padding-top: 0;
	}
}

/* ≤767: help page only — text first, thumbnails at bottom */
@media (max-width: 767.98px) {
	body.page-slug-help .landing-page .act-row > ul {
		flex-direction: column;
		flex-wrap: nowrap;
	}

	body.page-slug-help .landing-page .act-row li.act-desc {
		order: 1;
		width: 100% !important;
		border-left: 0 !important;
		border-top: 0 !important;
		padding-top: 0;
	}

	body.page-slug-help .landing-page .act-row li.act-img.landing-page-img {
		order: 2;
		width: 100% !important;
		max-width: 100% !important;
		flex: none;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		gap: 10px;
		padding: 16px 8px 8px;
		margin-top: 8px;
		border-top: 1px solid #bfbfbf;
		box-sizing: border-box;
	}

	body.page-slug-help .landing-page-img p {
		width: 88px;
		flex: 0 0 88px;
		margin: 0;
	}

	body.page-slug-help .landing-page-img p > img:first-of-type {
		max-width: 88px;
	}
}

/*
 * History, past-guest, guest-detail — image column + text (like help at desktop).
 * Mobile (≤767): thumbnails across the TOP, then text (not bottom like /help).
 */
.city-body .act-row > ul:has(> li.history-img) {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.city-body .act-row li.act-img.history-img {
	flex: 0 0 238px;
	width: 238px;
	max-width: 38%;
	float: none;
}

.city-body .act-row:has(li.history-img) li.act-desc {
	flex: 1 1 auto;
	width: auto !important;
	min-width: 0;
	min-height: 0 !important;
	float: none;
	border-left: 1px solid #bfbfbf;
}

.city-body .act-row:has(li.history-img) .act-detail {
	padding-left: 20px;
}

.city-body .act-row:has(li.history-img) .act-share {
	float: none;
	width: auto;
	text-align: left;
}

.city-body .history-img > div:empty,
.city-body .history-img > div:not(:has(*)) {
	display: none;
}

div.history_caption {
	line-height: 1.3;
	margin-bottom: 8px;
	font-size: 11px;
}

@media (max-width: 1199.98px) and (min-width: 768px) {
	.city-body .act-row li.act-img.history-img {
		flex: 0 0 200px;
		width: 200px;
		max-width: 34%;
	}

	.history-img p {
		width: 200px;
	}
}

@media (max-width: 1055px) and (min-width: 768px) {
	.city-body .act-row li.act-img.history-img {
		flex: 0 0 180px;
		width: 180px;
		max-width: 30%;
	}

	.history-img p {
		width: 180px;
	}
}

@media (max-width: 991.98px) and (min-width: 768px) {
	.city-body .act-row > ul:has(> li.history-img) {
		flex-wrap: nowrap !important;
	}

	.city-body .act-row li.act-img.history-img {
		flex: 0 0 160px;
		width: 160px;
		max-width: 28%;
	}

	.history-img p {
		width: 160px;
	}
}

@media (max-width: 767.98px) {
	.city-body .act-row > ul:has(> li.history-img) {
		flex-direction: column;
		flex-wrap: nowrap;
	}

	/* Thumbnails first (history / guests / guest-detail) */
	.city-body .act-row li.act-img.history-img {
		order: 1;
		width: 100% !important;
		max-width: 100% !important;
		flex: none;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		gap: 10px;
		padding: 0 8px 12px;
		margin: 0 0 8px;
		border-bottom: 1px solid #bfbfbf;
		box-sizing: border-box;
	}

	.city-body .act-row:has(li.history-img) li.act-desc {
		order: 2;
		width: 100% !important;
		border-left: 0 !important;
		border-top: 0 !important;
		padding-top: 0;
	}

	.history-img p {
		width: 88px;
		flex: 0 0 88px;
		margin: 0;
	}

	.history-img p > img:first-of-type {
		max-width: 88px;
	}
}

/* Fest guests grid (nyc-guests) — 3 columns desktop, 2 tablet, 1 phone */
@media (min-width: 768px) {
	.confirmed-nyc-guest ul li,
	.confirmed-nyc-guest ul li.center {
		width: 33.333% !important;
		height: auto;
		min-height: 280px;
		padding-bottom: 16px;
	}
}

@media (max-width: 767.98px) {
	.confirmed-nyc-guest ul li,
	.confirmed-nyc-guest ul li.center {
		width: 50% !important;
		height: auto;
		min-height: 280px;
		padding-bottom: 16px;
	}
}

/*
 * History + blog: #header children (logo, buy-tickets) extend below the header box
 * when the header uses absolute layout (768px+) — push content down; no #header edits.
 */
@media (min-width: 768px) {
	#content_holder > #header + #history-tab,
	#content_holder > #header + #main.main-body {
		margin-top: 40px;
	}
}

/*
 * Tablet 768–991: header-store-parity zeros content_holder padding — restore gutters
 * and prod-width column (999 / 969 + 15px) so content does not hug the viewport edge.
 */
@media (min-width: 768px) and (max-width: 991.98px) {
	#container > #content {
		width: 100% !important;
		max-width: 999px !important;
		margin-left: auto !important;
		margin-right: auto !important;
		box-sizing: content-box !important;
	}

	#content_holder,
	#white_space {
		width: 100% !important;
		max-width: 969px !important;
		margin-left: auto !important;
		margin-right: auto !important;
		padding-left: 15px !important;
		padding-right: 15px !important;
		box-sizing: content-box !important;
	}
}

/* ≤450: full-bleed content; vertical borders align with city tabs */
@media (max-width: 450.98px) {
	#container > #content {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#content_holder {
		max-width: 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#content_holder:has(> .city-tabs) .city-body,
	#content_holder:has(> #history-tab) .city-body,
	#history-tab ~ .city-body,
	.city-tabs ~ .city-body,
	.city-body.landing-page,
	.city-body.landing-page > .act-list,
	#content_holder:has(> #history-tab) .city-body .act-list,
	#content_holder:has(> .city-tabs) .city-body > .act-list {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.landing-page .act-list,
	#content_holder:has(> #history-tab) .city-body .act-list {
		border-left: 0 !important;
		border-right: 0 !important;
	}
}

/*
 * /blog — Reddle #primary + #secondary inside #main (Ken feedback 2026-05-28)
 * Fest shell and header-store-parity use #content; blog post column is #primary #content.
 */
#main.main-body {
	width: 100%;
	box-sizing: border-box;
}

/* Undo global #content rules that hit the nested blog column */
#main.main-body #primary {
	float: left;
	margin: 0 -36.8% 0 0;
	width: 100%;
	padding-top: 38px;
	border-top: 1px solid #ddd;
	box-sizing: border-box;
}

#main.main-body #primary #content {
	float: none;
	width: 575px;
	max-width: 100%;
	margin: 0 36.8% 0 0;
	box-sizing: border-box;
}

#main.main-body #secondary.widget-area,
#main.main-body #secondary {
	float: right;
	width: 31.571428571429%;
	max-width: 300px;
	margin-top: 38px;
	margin-bottom: 2em;
	border-left: 1px solid #ddd;
	box-sizing: border-box;
}

#main.main-body .entry-image {
	max-width: 100%;
	width: 100%;
	overflow: hidden;
	box-sizing: border-box;
}

#main.main-body .entry-image a {
	display: block;
	max-width: 100%;
}

#main.main-body .entry-image img,
#main.main-body .featured-image {
	display: block;
	max-width: 100% !important;
	width: 100% !important;
	height: auto !important;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
}

/* ≥901: flex two-column — sidebar stays top-aligned (fixes drop below posts) */
@media (min-width: 901px) {
	#main.main-body:has(#secondary) {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: flex-start;
		gap: 20px;
		padding-top: 8px;
		overflow: hidden;
	}

	#main.main-body:has(#secondary) #primary {
		float: none !important;
		margin: 0 !important;
		flex: 1 1 auto;
		min-width: 0;
		width: auto !important;
		padding-top: 38px;
	}

	#main.main-body:has(#secondary) #primary #content {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
	}

	#main.main-body:has(#secondary) #secondary {
		float: none !important;
		flex: 0 0 280px;
		width: 280px !important;
		max-width: 32% !important;
		margin-top: 38px !important;
		align-self: flex-start;
		position: static !important;
	}
}

/* header-store-parity targets all #content — restore blog column when flex layout active */
@media (max-width: 991.98px) and (min-width: 901px) {
	#main.main-body #primary #content {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
	}

	#main.main-body:has(#secondary) #secondary {
		flex-basis: 260px;
		width: 260px !important;
	}
}

@media (max-width: 1055px) and (min-width: 901px) {
	#main.main-body:has(#secondary) #secondary {
		flex-basis: 240px;
		width: 240px !important;
	}
}

/* ≤900: stack; sidebar widgets in a horizontal row (calendar / topics / archive) */
@media (max-width: 900px) {
	#main.main-body:has(#secondary) {
		display: flex;
		flex-direction: column;
		padding-top: 8px;
	}

	#main.main-body:has(#secondary) #primary {
		float: none !important;
		margin: 0 !important;
		width: 100% !important;
		order: 1;
		padding-top: 24px;
	}

	#main.main-body:has(#secondary) #primary #content {
		width: 100% !important;
		margin: 0 !important;
	}

	#main.main-body:has(#secondary) #secondary {
		float: none !important;
		order: 2;
		width: 100% !important;
		max-width: 100% !important;
		margin-top: 24px !important;
		border-left: 0;
		border-top: 1px solid #ddd;
		padding-top: 16px;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 16px 20px;
	}

	#main.main-body:has(#secondary) #secondary .widget {
		float: none !important;
		flex: 1 1 200px;
		min-width: 180px;
		max-width: calc(50% - 12px);
		margin: 0 !important;
		box-sizing: border-box;
	}

	#main.main-body:has(#secondary) #secondary .widget + .widget {
		margin-top: 0 !important;
	}
}

@media (max-width: 450.98px) {
	#main.main-body:has(#secondary) #secondary .widget {
		flex: 1 1 100%;
		max-width: 100%;
	}
}

/*
 * Buy tickets: title bar wraps inside gray band; ticket box + bottom cap
 * contain disclaimer and card logos (no border cutting through floats).
 */
.city-body:has(#buy-tickets) {
	height: auto !important;
	min-height: 0;
}

#buy-tickets.city-body {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.city-body:has(#buy-tickets) > .city-name-title {
	height: auto !important;
	min-height: 38px;
	overflow: hidden;
	box-sizing: border-box;
}

.city-body:has(#buy-tickets) > .city-name-title span,
.city-body:has(#buy-tickets) > .city-name-title .brown-color,
.city-body:has(#buy-tickets) > .city-name-title a {
	display: block;
	line-height: 1.25 !important;
	padding: 8px 16px !important;
	white-space: normal !important;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) {
	box-sizing: border-box;
	width: 100%;
	overflow: hidden;
	border-left: 1px solid #c8c8c8 !important;
	border-right: 1px solid #c8c8c8 !important;
	padding-bottom: 20px !important;
}

#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) > div[style*="height: 38px"],
#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) > div[style*="height:38px"] {
	height: auto !important;
	min-height: 38px;
	overflow: hidden;
	clear: both;
	padding-bottom: 16px !important;
	box-sizing: border-box;
}

#buy-tickets #ticket-disclaimer,
#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) > div[style*="height: 38px"] > div[style*="float: left"],
#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) > div[style*="height:38px"] > div[style*="float: left"] {
	float: left;
	width: 50% !important;
	max-width: calc(100% - 140px);
	box-sizing: border-box;
}

#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) > div[style*="height: 38px"] img[style*="float: right"],
#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) > div[style*="height:38px"] img[style*="float: right"] {
	float: right;
	max-width: 130px;
	height: auto;
}

#buy-tickets .act-btm-cls {
	clear: both;
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin: 0;
	border: 1px solid #c8c8c8 !important;
	border-top: 1px solid #c8c8c8 !important;
	height: auto !important;
	min-height: 20px;
}

@media (max-width: 575.98px) {
	.city-body:has(#buy-tickets) > .city-name-title span,
	.city-body:has(#buy-tickets) > .city-name-title .brown-color,
	.city-body:has(#buy-tickets) > .city-name-title a {
		font-size: 16px !important;
		padding-left: 12px !important;
		padding-right: 12px !important;
	}

	#buy-tickets #ticket-disclaimer,
	#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) > div[style*="height: 38px"] > div[style*="float: left"],
	#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) > div[style*="height:38px"] > div[style*="float: left"] {
		float: none !important;
		width: 100% !important;
		max-width: 100%;
	}

	#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) > div[style*="height: 38px"] img[style*="float: right"],
	#buy-tickets.city-body > div:first-of-type:not(.act-btm-cls) > div[style*="height:38px"] img[style*="float: right"] {
		float: none !important;
		display: block;
		margin: 12px auto 0;
		max-width: 100%;
	}
}