main.hp-whats-on .hp-divider {
	width: 75px;
	margin-bottom: 35px;
}

main.hp-whats-on .hp-filter-count-hidden {
	display: none;
}

	
	.text-shadow {
		text-shadow: 10px 1px 14px #000000
	}
	.padding {
		padding: 10px;
		border-radius: 7px;
		background: transparent;
		display: flex;
		flex-direction: column;
	}
	
	.feature-image img, .fimg img {
		object-fit: cover;
		width:100%;
		height:350px;
		transition: all .25s ease-in-out;
		-moz-transition: all .25s ease-in-out;
		-webkit-transition: all .25s ease-in-out;
		border-radius:5px;
	}

	.latest .date img {
		width: 30px;
		height: 30px;
		width: 36px;
		height: 38px;
		margin-bottom: 8px;
		padding: 0;
		margin-right: 10px;
	}
	.latest .date {
		margin-bottom: 30px;
		font-weight: 600;
		font-size: 1.0625rem;
		text-shadow: 0px 3px 22px rgba(0,0,0,1), 0px 7px 28px rgba(0,0,0,1);
	}
	.latest h3 {
		text-shadow: 0px 3px 22px rgba(0,0,0,1), 0px 7px 28px rgba(0,0,0,1);
		text-transform: uppercase;
		font-weight: bold !important;
		color: #FFF;
		font-size: 1.4375rem;
		letter-spacing: 0.8px;
		margin-bottom: 0;
		-webkit-font-smoothing: antialiased;
		text-rendering: optimizeLegibility;
	}	
	.btn:hover {
		opacity: 1;
		-ms-transform: scale(1);
		-webkit-transform: scale(1);
		transform: scale(1);
	}
	
	
	.btn2:hover {
		transform: translateX(-50%) translateZ(0);
	}
	
	.excerpt {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		color: #FFFFFF;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		text-align: center;
		width: 80%;
		margin: 0 auto;
		padding: 0 20px;
		pointer-events: none;
	}
	
	
	.excerpt h3,
	.excerpt .date {
		position: static;
		left: auto;
		transform: none;
	}
	
	.btn:not(.btn1):not(.btn2) {
		background-color: #6f8080;
		font-size: 1.0625rem;
	}
	.btn1, .menus .btn1 {
		position: relative;
		display: inline-block;
		padding: 8px 18px;
		border-radius: 50px;
		margin-top: 10px;
		font-size: 1rem;
		font-weight: 500;
		letter-spacing: 0.8px;
		color: #ffffff;
		background: rgba(58, 68, 68, 0.5) !important;
		backdrop-filter: blur(15px) !important;
		-webkit-backdrop-filter: blur(15px) !important;
		text-shadow: 0 2px 10px rgba(0, 0, 0, 0.7);
		-webkit-font-smoothing: antialiased;
		text-rendering: optimizeLegibility;
		z-index: 0;
		border: none;
	}
	
	.btn1::before, .menus .btn1::before {
		content: "";
		position: absolute;
		inset: 0;
		pointer-events: none;
		opacity: 0;
		background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0));
		transition: opacity .2s ease;
		border-radius: 50px;
		z-index: -1;
	}
	.btn1:hover::before,
	.btn1:focus::before {
		opacity: 1;
	}

	.btn2, .menus .btn2 {
		position: absolute;
		top: 15px;
		left: 50%;
		transform: translateX(-50%) translateZ(0);
		padding: 8px 18px;
		border-radius: 50px;
		margin-top: 10px;
		font-size: 0.75rem;
		font-weight: 500;
		letter-spacing: 0.8px;
		z-index: 3;
		background: rgba(255, 255, 255, 0.1);
		border: 2px solid rgba(255, 255, 255, 0.9);
		color: #ffffff;
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
		text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
		box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-rendering: optimizeLegibility;
		overflow: hidden;
		isolation: isolate;
	}
	
.btn2-special::before, .menus .btn2-special::before {
	content: "";
	position: absolute;
	inset: -30% -75%;
	background: linear-gradient(115deg,
		transparent 30%,
		rgba(255,255,255,.25) 47%,
		rgba(255,255,255,.15) 53%,
		transparent 70%);
	transform: translateX(-70%);
	-webkit-transform: translateX(-70%);
	pointer-events: none;
	z-index: 2;
	opacity: 0;
}

.btn2-special.shimmer-played::before {
	animation: btn2-sheen 1.4s ease-out forwards;
	-webkit-animation: btn2-sheen 1.4s ease-out forwards;
}

@keyframes btn2-sheen {
	0% { transform: translateX(-74%); opacity: 0; }
	25% { opacity: .9; }
	100% { transform: translateX(26%); opacity: 0; }
}

@-webkit-keyframes btn2-sheen {
	0% { -webkit-transform: translateX(-74%); opacity: 0; }
	25% { opacity: .9; }
	100% { -webkit-transform: translateX(26%); opacity: 0; }
}


.filter-btn[data-filter="events"]::before {
	content: "";
	position: absolute;
	inset: -30% -75%;
	background: linear-gradient(115deg,
		transparent 30%,
		rgba(255,255,255,.25) 47%,
		rgba(255,255,255,.15) 53%,
		transparent 70%);
	transform: translateX(-70%);
	-webkit-transform: translateX(-70%);
	pointer-events: none;
	z-index: 2;
	opacity: 0;
}

.filter-btn[data-filter="events"].shimmer-played::before {
	animation: filter-sheen 1.4s ease-out forwards;
	-webkit-animation: filter-sheen 1.4s ease-out forwards;
}

@keyframes filter-sheen {
	0% { transform: translateX(-74%); opacity: 0; }
	25% { opacity: .9; }
	100% { transform: translateX(26%); opacity: 0; }
}

@-webkit-keyframes filter-sheen {
	0% { -webkit-transform: translateX(-74%); opacity: 0; }
	25% { opacity: .9; }
	100% { -webkit-transform: translateX(26%); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.btn2-special::before,
	.filter-btn[data-filter="events"]::before {
		animation: none !important;
		-webkit-animation: none !important;
	}
}

	
	.filter {
		
	}
	.filter img {
		-webkit-filter: grayscale(100%);
		filter: grayscale(100%);
		opacity: 0.5;
	}
	
	.menus {
		padding-bottom: 0;
	}
	
	@media (min-width: 992px) {
		.zooming:hover {
			z-index: 5;
		}
		.zooming {
			transition: box-shadow 0.5s;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			text-rendering: optimizeLegibility;
		}
		
		
		.type-menus .zooming:hover,
		.post-type-menus .zooming:hover {
			box-shadow: none;
		}
	}
	
	@media (max-width: 600px) {
		.btn:not(.btn1):not(.btn2) {
			font-size: 0.875rem;
		}
	}

	.fade-up {
		background-image: linear-gradient(to bottom, transparent, #192032dd);
		min-height: 45%;
		position: absolute;
		bottom: 0;
		width: 100%;
		z-index: 0;
	}
	
	
	
	.container.latest {
		max-width: 1440px; 
	}
	
	
	
	.controls-wrapper {
		max-width: 900px;
		margin: 0 auto;
		padding: 0 20px;
	}
	
	
	.search-box {
		margin-bottom: 35px;
		position: relative;
	}
	
	#searchInput {
		width: 100%;
		padding: 15px 25px;
		border: 2px solid rgba(111, 128, 128, 0.3);
		border-radius: 50px;
		background: rgba(58, 68, 68, 0.4);
		color: #ffffff;
		font-size: 1rem;
		font-weight: 400;
		letter-spacing: 0.5px;
		text-align: center;
		transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
		backdrop-filter: blur(10px);
	}
	
	#searchInput:focus {
		outline: none;
		border-color: #88a0a0;
		background: rgba(58, 68, 68, 0.6);
		box-shadow: 0 8px 30px rgba(111, 128, 128, 0.2);
		transform: translateY(-2px);
	}

	#searchInput:focus-visible {
		outline: 3px solid #88a0a0;
		outline-offset: 2px;
	}
	
	#searchInput::placeholder {
		color: rgba(255, 255, 255, 0.6);
		font-weight: 400;
	}
	
	.search-box::before {
		content: '';
		position: absolute;
		left: 20px;
		top: 50%;
		transform: translateY(-50%);
		width: 18px;
		height: 18px;
		background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%2388a0a0" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><path d="m21 21-4.35-4.35"></path></svg>') no-repeat center;
		opacity: 0.6;
		pointer-events: none;
	}
	
	
	.filter-buttons {
		margin-bottom: 40px;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 12px;
	}
	
	.filter-btn {
		background: rgba(111, 128, 128, 0.5);
		color: rgba(255, 255, 255, 0.8);
		border: 1px solid rgba(111, 128, 128, 0.5);
		padding: 10px 24px;
		border-radius: 50px;
		cursor: pointer;
		font-size: 0.875rem;
		font-weight: 400;
		letter-spacing: 0.8px;
		text-transform: uppercase;
		transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
		backdrop-filter: blur(5px);
		position: relative;
		overflow: hidden;
		isolation: isolate;
	}
	
	
	.filter-btn[data-filter="events"]::before {
		content: "";
		position: absolute;
		inset: -30% -75%;
		background: linear-gradient(115deg,
			transparent 30%,
			rgba(255,255,255,.25) 47%,
			rgba(255,255,255,.15) 53%,
			transparent 70%);
		transform: translateX(-70%);
		-webkit-transform: translateX(-70%);
		animation: filter-sheen 4s ease-in-out infinite;
		-webkit-animation: filter-sheen 4s ease-in-out infinite;
		pointer-events: none;
		z-index: 2;
	}
	
	@keyframes filter-sheen {
		0%, 10% { transform: translateX(-74%); opacity: 0; }
		22% { opacity: .9; }
		40%, 100% { transform: translateX(26%); opacity: 0; }
	}
	
	@-webkit-keyframes filter-sheen {
		0%, 10% { -webkit-transform: translateX(-74%); opacity: 0; }
		22% { opacity: .9; }
		40%, 100% { -webkit-transform: translateX(26%); opacity: 0; }
	}
	
	.filter-btn:hover {
		background: rgba(111, 128, 128, 0.5);
		border-color: rgba(111, 128, 128, 0.5);
		color: #ffffff;
		transform: translateY(-2px);
		box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
	}
	
	.filter-btn.active {
		background: rgba(111, 128, 128, 1);
		border-color: #6f8080;
		color: #ffffff;
		box-shadow: 0 4px 15px rgba(111, 128, 128, 0.3);
	}
	
	
	.filter-count {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 26px;
		height: 26px;
		padding: 0 7px;
		margin-left: 6px;
		background: rgba(255, 255, 255, 0.25);
		border-radius: 50px;
		font-size: 0.8125rem;
		font-weight: 700;
		color: #ffffff;
		line-height: 1;
		animation: popInBounce 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
		transition: all 0.3s ease;
	}
	
	.filter-btn.active .filter-count {
		background: rgba(255, 255, 255, 0.35);
		transform: scale(1.05);
	}
	
	.filter-btn:hover .filter-count {
		transform: scale(1.1);
		background: rgba(255, 255, 255, 0.3);
	}
	
	@keyframes popInBounce {
		0% {
			opacity: 0;
			transform: scale(0) rotate(-10deg);
		}
		50% {
			transform: scale(1.15) rotate(5deg);
		}
		70% {
			transform: scale(0.95) rotate(-3deg);
		}
		85% {
			transform: scale(1.05) rotate(2deg);
		}
		100% {
			opacity: 1;
			transform: scale(1) rotate(0);
		}
	}
	
	
	
	.status-badge {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		padding: 12px 20px;
		font-size: 0.625rem;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 1.2px;
		z-index: 3;
		background: rgba(58, 68, 68, 0.5);
		color: #ffffff;
		backdrop-filter: blur(15px);
		-webkit-backdrop-filter: blur(15px);
		text-align: center;
		animation: fadeInSlide 0.6s cubic-bezier(0.4, 0, 0.2, 1);
		text-shadow: 0 2px 10px rgba(0, 0, 0, 0.7);
	}
	
	@keyframes fadeInSlide {
		0% {
			opacity: 0;
			transform: translateY(20px);
		}
		100% {
			opacity: 1;
			transform: translateY(0);
		}
	}

	
	.feature-image {
		position: relative;
		overflow: hidden;
		border-radius: 18px;
		display: flex;
		align-items: center;
		justify-content: center;
		flex: 1;
		width: 100%;
	}
	.feature-image img {

	}
	.feature-image::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 1;
	}
	
	.feature-image:hover img {
		transform: scale(1.08) translateZ(0);
		opacity: 0.7;
	}
	
	.feature-image:hover .excerpt h3 {
		transform: translateZ(0);
		opacity: 1 !important;
	}
	
	.feature-image:hover .excerpt .date {
		transform: translateZ(0);
		opacity: 1 !important;
	}
	
	.feature-image .excerpt h3,
	.feature-image .excerpt .date {
		transition: opacity 0.3s ease;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-rendering: optimizeLegibility;
		transform: translateZ(0);
	}

	
	
	.countdown-timer {
		display: inline-block;
		background: rgba(58, 68, 68, 0.5);
		border: 2px solid rgba(255, 255, 255, 0.7);
		padding: 6px 14px;
		border-radius: 50px;
		font-size: 0.75rem;
		font-weight: 500;
		letter-spacing: 0.8px;
		color: #ffffff;
		text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
	}
	
	
	.countdown-timer-full {
		position: absolute;
		bottom: 36px; 
		left: 0;
		right: 0;
		width: 100%;
		padding: 8px 20px;
		font-size: 0.9375rem;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 1.2px;
		z-index: 3;
		color: #ffffff;
		text-align: center;
		animation: fadeInSlide 0.6s cubic-bezier(0.4, 0, 0.2, 1);
		text-shadow: 0 2px 10px rgba(0, 0, 0, 0.7);
	}
	
	
	.feature-image:not(:has(.status-badge)) .countdown-timer-full {
		bottom: 0;
	}
	
	
	
	.featured-event {
		grid-column: 1 / -1;
	}
	
	.featured-event .feature-image img {
		height: 450px;
	}
	
	.featured-event h3 {
		font-size: 2.1875rem !important;
	}
	
	.featured-event .status-badge {
		padding: 8px 18px;
		font-size: 0.6875rem;
	}
	
	
	
	@media (max-width: 768px) {
		.featured-event .feature-image img {
			height: 350px;
		}
		
		.featured-event h3 {
			font-size: 1.5625rem !important;
		}
		
		.filter-btn {
			padding: 8px 18px;
			font-size: 0.75rem;
		}
		
		#searchInput {
			padding: 12px 20px 12px 45px;
			font-size: 0.875rem;
		}
		
		
		.zooming {
			flex: 0 0 100% !important;
			max-width: 100% !important;
		}
	}
	
	@media (max-width: 480px) {
		.status-badge {
			padding: 4px 10px;
			font-size: 0.5625rem;
			letter-spacing: 0.8px;
		}
		
		.filter-buttons {
			gap: 8px;
		}
	}
	
	
	
	.no-results {
		display: none;
		text-align: center;
		padding: 60px 40px;
		background: linear-gradient(135deg, rgba(111, 128, 128, 0.1) 0%, rgba(58, 68, 68, 0.15) 100%);
		border-radius: 15px;
		margin: 40px auto;
		max-width: 600px;
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
		border: 1px solid rgba(255, 255, 255, 0.1);
		box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
	}
	
	.no-results h3 {
		color: #ffffff;
		font-size: 1.5625rem;
		font-weight: 600;
		margin-bottom: 15px;
		text-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
	}
	
	.no-results p {
		color: rgba(255, 255, 255, 0.8);
		font-size: 1rem;
		line-height: 1.6;
		margin-bottom: 25px;
		font-weight: 300;
	}
	
	.no-results .icon {
		font-size: 3rem;
		color: rgba(111, 128, 128, 0.6);
		margin-bottom: 20px;
		display: block;
	}
	
	
	
	.zooming {
		opacity: 1;
		transform: scale(1) translateY(0);
	}
	
	.zooming.filtering-out {
		opacity: 0 !important;
		transform: scale(0.95) !important;
		transition: opacity 0.25s ease, transform 0.25s ease !important;
	}
	
	.zooming.filtering-in {
		opacity: 0;
		display: block !important;
		animation: filterIn 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards;
	}
	
	@keyframes filterIn {
		0% {
			opacity: 0;
			transform: scale(0.95) translateY(10px);
		}
		100% {
			opacity: 1;
			transform: scale(1) translateY(0);
		}
	}
	
	
	
	
	.zooming.filtering-in:nth-child(1) { animation-delay: 0s; }
	.zooming.filtering-in:nth-child(2) { animation-delay: 0.05s; }
	.zooming.filtering-in:nth-child(3) { animation-delay: 0.1s; }
	.zooming.filtering-in:nth-child(4) { animation-delay: 0.15s; }
	.zooming.filtering-in:nth-child(5) { animation-delay: 0.2s; }
	.zooming.filtering-in:nth-child(6) { animation-delay: 0.25s; }
	.zooming.filtering-in:nth-child(7) { animation-delay: 0.3s; }
	.zooming.filtering-in:nth-child(8) { animation-delay: 0.35s; }
	.zooming.filtering-in:nth-child(9) { animation-delay: 0.4s; }
	.zooming.filtering-in:nth-child(n+10) { animation-delay: 0.45s; }
	
	
	.zooming[hidden] {
		display: none !important;
		width: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		visibility: hidden !important;
		position: absolute !important;
	}
	
	
	.latest .row {
		display: flex;
		flex-wrap: wrap;
	}
	
	
	.zooming {
		display: flex !important;
	}