.body {
		font-family: "GH Guardian Headline", "Guardian Egyptian Web", Georgia, serif !important;
	}

	.section-title {
		background-color: #00AEEF;
		color: #fff;
		padding: 20px;
		text-align: center;
	}

	.content-title {
		font-weight: bold;
		color: #116BB4;
		font-size: 20px;
		text-transform: capitalize !important;
	}

	.heading_sm_first {
		font-size: 2.8125rem;
		line-height: 54px;
		margin: 0 0 15px;
		color: #333333;
		font-family: GuardianTextSans, "Guardian Text Sans Web", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif !important;
		font-weight: 600;
	}

	.numbering_sub_title {
		font-size: 40px;
		font-weight: bold !important;
		color: #4e5154;
	}

	.content-text {
		font-size: 14px;
	}

	.icon {
		color: #c0392b;
		font-size: 1em;
		margin-right: 10px;
	}

	.active_sub_side_menu a {
		/* color: #fff; */
		background-color: #0a3054b5;
	}





			.card {
				border-left: 5px solid #ffa21e;
				background-color: #fff;
				border-radius: 12px;
				box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
				padding: 20px;
				display: flex;
				flex-direction: column;
				gap: 16px;
				margin: auto;
			}

			.post-inner {
				display: flex;
				gap: 20px;
			}

			.image-outer-wrapper {
				width: 120px;
				height: 120px;
			}

			.animated-image-card {
				width: 100%;
				height: 100%;
				overflow: hidden;
				position: relative;
				border-radius: 16px;
			}

			.image-wrapper {
				width: 100%;
				height: 100%;
				position: relative;
			}

			.original-img,
			.animation-img {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				/* object-fit: cover; */
				transition: all 0.8s ease;
				border-radius: 16px;
			}

			.original-img {
				transform: scale(1);
				filter: blur(0);
				opacity: 1;
				z-index: 2;
			}

			.animation-img {
				transform: scaleX(1.5);
				filter: blur(8px);
				opacity: 0;
				transform-origin: left;
				z-index: 1;
			}

			.animated-image-card:hover .original-img {
				transform: scale(1.15);
				filter: blur(8px);
				opacity: 0;
			}

			.animated-image-card:hover .animation-img {
				transform: scaleX(1);
				filter: blur(0);
				opacity: 1;
			}

			.content-wrapper {
				flex: 1;
			}

			.title {
				font-size: 18px;
				font-weight: 600;
				margin: 0 0 6px;
			}

			.meta-wrapper {
				display: flex;
				gap: 20px;
				font-size: 14px;
				color: #666;
				margin-bottom: 8px;
			}

			.excerpt {
				color: #555;
				font-size: 15px;
			}

			.footer-wrap {
				display: flex;
				justify-content: space-between;
				border-top: 1px solid #e0e0e0;
				padding-top: 10px;
				font-size: 14px;
			}

			.terms-wrapper span {
				margin-right: 12px;
				font-weight: 600;
			}

			.term-item span {
				color: #ff9f43;
			}

			.term-item+.term-item span {
				color: #d63384;
			}

			.footer-meta {
				display: flex;
				gap: 20px;
				color: #555;
			}

			.footer-meta i {
				margin-right: 5px;
			}

			/* Responsive styles for mobile */
			@media (max-width: 767px) {
				.post-inner {
					flex-direction: column;
					/* stack image on top */
					gap: 12px;
				}

				.image-outer-wrapper {
					width: 100%;
					/* full width */
					height: auto;
				}

				.animated-image-card,
				.image-wrapper {
					width: 100%;
					height: auto;
					border-radius: 12px;
				}



				.content-wrapper {
					flex: none;
				}
			}

			@media (max-width: 767px) {
				.image-outer-wrapper {
					width: 120px;
					/* ya jitna chahiye */
					height: 120px;
					margin: auto;
					/* center karne ke liye */
				}

				.animated-image-card,
				.image-wrapper {
					width: 100%;
					height: 100%;
					border-radius: 16px;
					/* thoda zyada rounded */
				}

				.original-img,
				.animation-img {
					position: absolute !important;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					/* object-fit: cover; */
					transition: all 0.8s ease;
					border-radius: 16px;
					filter: blur(0);
					opacity: 1;
					transform: scale(1);
					z-index: 2;
				}

				.animation-img {
					transform: scaleX(1.5);
					filter: blur(8px);
					opacity: 0;
					transform-origin: left;
					z-index: 1;
				}

				/* Hover effect on mobile (works if device supports hover) */
				.animated-image-card:hover .original-img {
					transform: scale(1.15);
					filter: blur(8px);
					opacity: 0;
				}

				.animated-image-card:hover .animation-img {
					transform: scaleX(1);
					filter: blur(0);
					opacity: 1;
				}
			}

			/* Container image section */
			.soccer-first-section-image {
				position: relative;
				width: 100%;
				height: 45vh;
				overflow: hidden;
			}

			@media (min-width: 1500px) {
				.soccer-event {
					width: 65%;
				}
			}

			@media (min-width: 1500px) {
				.soccer-container-overlay {
					/* max-width: 1420px; */
				}
			}

			/* Background image */
			.soccer-first-img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

			/* Overlay content desktop */
			.soccer-container-overlay {
				position: absolute;
				top: 0;
				left: 90px;
				width: 100%;
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: flex-start;
				color: #fff;
				padding: 20px;
				padding-top: 35px;
				text-align: left;
			}

			.soccer-event {
				position: absolute;
				top: 50%;
				left: 1%;
				transform: translateY(-128%);
				text-align: left;
				width: 80%;
			}

			.soccer-event-name span {
				background-color: #4D534A;
				color: #ffe500;
				padding: 7px 5px 16px 8px;
				font-size: 50px;
				font-weight: bold;
				display: inline-block;
				box-decoration-break: clone;
				-webkit-box-decoration-break: clone;
			}

			.soccer-event-description {
				width: 870px;
			}

			.soccer-event-description span {
				font-weight: 700;
				background-color: #fff;
				color: #4d534a;
				font-size: 23px;
				line-height: 2rem;
				padding: 8px 12px;
				display: inline;
				box-decoration-break: clone;
				-webkit-box-decoration-break: clone;
			}

			/* Mobile layout */
			.soccer-mobile-screen {
				display: none;
				padding: 15px;
			}

			.soccer-event-name-mobile span {
				background-color: #4D534A;
				color: #ffe500;
				padding: 8px 12px;
				font-size: 1.8rem;
				font-weight: bold;
				display: inline-block;
			}

			@media (max-width: 766px) {
				.soccer-desktop-screen {
					display: none;
				}

				.soccer-mobile-screen {
					display: block;
				}

				.soccer-first-section-image {
					height: auto;
				}

				/* .soccer-first-img {
					height: auto;
				} */
			}

			/* Optional: for tablets */
			@media (min-width: 767px) and (max-width: 991px) {
				.soccer-event-name span {
					font-size: 2rem;
				}

				.soccer-event-description span {
					font-size: 1rem;
					line-height: 1.6rem;
				}
			}


			.soccer-heading-dropdown-wrapper {
				display: flex;
				justify-content: space-between;
				align-items: center;
				flex-wrap: wrap;
				margin-bottom: 20px;
				margin: 0px 15px;
			}

			.soccer-heading_sm_first {
				font-size: 2.8125rem;
				line-height: 54px;
				margin: 0 0 15px;
				color: #333333;
				font-family: GuardianTextSans, "Guardian Text Sans Web", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif !important;
				font-weight: 600;
			}

			.soccer-heading_sm_first {
				font-size: 30px;
				font-weight: bold;
			}

			.soccer-heading_sm_first {
				font-size: 16px;
				font-weight: bold;
			}

			.soccer-dropdown-container {
				position: relative;
				width: 200px;
			}

			.soccer-dropdown-btn {
				width: 100%;
				background-color: white !important;
				color: #0084c5;
				/* padding: 10px; */
				font-size: 14px;
				border: none;
				cursor: pointer;
				border: 1px solid #0084c5;
				border-radius: 50px;

			}

			.soccer-dropdown-menu {
				display: none;
				position: absolute;
				top: 100% !important;
				left: 0;
				width: 100%;
				padding: 0px !important;
				background-color: #fff;
				border: 1px solid #ddd;
				z-index: 999;
				box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
			}

			.soccer-city-dropdown-list a {
				display: block;
				padding: 0px 10px;
				color: #0084c5;
				text-decoration: none;
			}

			.soccer-city-dropdown-list a:hover {
				background-color: #0084c5;
				color: white;
			}

			.container-fluid {
				margin-top: 5%;
			}

			@media (max-width: 766px) {
				.soccer-first-img {
					width: -webkit-fill-available;
					margin-left: 15px;
					margin-right: 15px;
					height: 180px;
				}
			}

			.soccer-h2 {
				margin-bottom: 0px;
			}

			.soccer-h2 {
				font-family: "GH Guardian Headline", "Guardian Egyptian Web", Georgia, serif !important;
				text-transform: none !important;
			}

			/* first image css */
			body,
			h2,
			h1 {
				font-family: "GH Guardian Headline", "Guardian Egyptian Web", Georgia, serif !important;
				text-transform: none !important;
			}

			.menu {
				float: left;
				/* margin-left: -134px; */
				display: flex;
				margin-top: 52px;
			}

			.first-img {
				width: 100%;
				height: 300px;
			}

			.event-name span {
				padding: 0px 10px;
				background-color: #4D534A;
				color: #ffe500;
			}

			.event-description {
				width: 91% !important;
			}

			.container-overlay {
				position: relative;
				display: flex;
				align-items: center;
				justify-content: center;
				text-align: left;
				/* Ensure text starts from left */
				color: #fff;
			}

			.first-section-image {
				position: relative;
				width: 100%;
				height: 45vh;
			}

			.first-img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

			.event {
				position: absolute;
				top: 50%;
				left: 1%;
				/* Move text to the left */
				/* transform: translateY(-140%); */
				transform: translateY(-128%);
				text-align: left;
				/* Ensures text aligns to the left */
				width: 80%;
				/* Adjust width if needed */
			}

			@media(min-width: 1500px) {
				.event {
					width: 65%;
				}
			}

			h2 {
				margin-bottom: 0rem;
			}

			.event-name span {
				padding: 7px 2px 16px 8px;
				/* background-color: rgba(77, 83, 74, 0.8); */
				color: #ffe500;
				/* font-size: 50px; */
				font-weight: bold;
				display: inline-block;
				width: 470px;
				font-size: 50px;
			}

			.event-description {
				width: 98% !important;
			}

			.past-event {
				margin-top: 130px;
			}

			.upcoming-event {
				margin-top: 130px;
			}

			.event-description span {
				font-weight: 700;
				background-color: #fff;
				/* White background */
				color: #4d534a;
				font-size: 1.5rem;
				line-height: 2rem;
				padding: 5px 10px;
				/* Left & right padding added */
				display: inline;
				box-decoration-break: clone;
				/* Ensures background wraps only around text */
				-webkit-box-decoration-break: clone;
				/* Safari support */
			}



			/* upcoming event section */
			.upcoming-event-name {
				font-size: 2.5rem;
				font-weight: 700;
			}

			.upcoming-event-name span {
				background-color: #121212;
				color: #ffffff;
				/* padding: 5px; */
				padding: 0px 5px 5px 5px;
			}

			.upcoming-event-description span {
				background-color: #ffffff;
				padding: 5px;
			}

			.upcoming-event-description {
				font-weight: 700;
				font-size: 1.3rem;
				color: #121212;
				/* margin-left: 5px; */
				margin-top: -7px;
				margin-bottom: 60px;
			}

			.img-fluid-upcoming,
			.img-thumbnail,
			.wp-caption img {
				max-width: 100%;
				height: 260px;
			}

			.img-upcoming-description {
				margin: 10px 10px;
			}

			.upcoming-description-name {
				font-weight: 600;
				font-size: 21px;
				margin-bottom: 5px;
			}

			.upcoming-description {
				color: #aa8961;
				font-size: 17px;
				font-weight: 600;
			}

			.upcoming-border {
				border-top: 1px solid #dee2e6;
				margin-top: 10px;
				margin-bottom: 10px;
			}

			.upcoming-time {
				font-style: italic;
				margin-bottom: 0.5rem;
				font-size: 0.9rem;
				color: #999;
			}

			.background {
				transition: transform 0.2s ease-in-out;
				position: relative;
				background-color: #FFFFFF;
				border: 1px solid #e9ecef;
				height: 440px;
			}

			.background:hover {
				transform: translateY(-3px);
				box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .05);
				/* box-shadow: 2px 4px 10px rgba(0, 0, 0, 0.05),
                -2px 4px 10px rgba(0, 0, 0, 0.05),
                2px -2px 10px rgba(0, 0, 0, 0.05),
                -2px -2px 10px rgba(0, 0, 0, 0.05); */
				/* Move Up Only */
				/* box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2); Optional: Shadow Effect */
			}

			.bg-color {
				background-color: #F8F9FA !important;
				margin-top: 4px;
			}

			.space-bottom-last {
				padding-bottom: 36px;
			}


			/* past event section */
			.past-event-name {
				font-size: 2.5rem;
				font-weight: 700;
			}

			.past-event-name span {
				background-color: #121212;
				color: #ffffff;
				/* padding: 5px; */
				padding: 0px 5px 5px 5px;
			}

			.past-event-description span {
				background-color: #ffffff;
				padding: 5px;
			}

			.past-event-description {
				font-weight: 700;
				font-size: 1.3rem;
				color: #121212;
				/* margin-left: 5px; */
				margin-top: -7px;
				margin-bottom: 60px;
			}

			.img-fluid,
			.img-thumbnail,
			.wp-caption img {
				max-width: 100%;
				height: 280px;
			}

			.img-past-description {
				margin: 10px 10px;
			}

			.past-description-name {
				font-weight: 600;
				font-size: 21px;
				margin-bottom: 5px;
			}

			.past-description {
				color: #aa8961;
				font-size: 17px;
				font-weight: 600;
			}

			.past-border {
				border-top: 1px solid #dee2e6;
				margin-top: 10px;
				margin-bottom: 10px;
			}

			.past-time {
				font-style: italic;
				margin-bottom: 0.5rem;
				font-size: 0.9rem;
				color: #999;
			}

			.border {
				transition: transform 0.2s ease-in-out;
				position: relative;
				background-color: #FFFFFF;
				border: 1px solid #e9ecef;
				height: 440px;
			}

			.border:hover {
				transform: translateY(-3px);
				box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .05);
			}

			.a-tag {
				color: #444444;
			}

			.a-tag:hover {
				color: #444444;
			}

			/* sub menu css */
			.cb-menu {
				background-color: #fff;
				position: relative;
				border-bottom: 1px solid #dcdcdc;
			}

			.cb-menu__wrapper {
				display: flex;
				align-items: flex-start;
				flex-wrap: wrap;
			}

			.cb-subnav {
				line-height: 1;
				list-style-type: none;
				display: flex;
				position: relative;
				z-index: 1;
				margin-right: auto;
			}

			.font-headline {
				font-family: GHGuardianHeadline, Georgia, serif;
			}

			ul {
				list-style: none;
			}

			.cb-subnav__link {
				font-weight: 400;
				color: #121212;
				display: block;
				font-size: 16px;
				height: 43px;
				line-height: 43px;
				padding: 0 7px;
				position: relative;
				white-space: nowrap;
			}

			.cb-subnav__link:hover {
				font-weight: 400;
				color: #121212;
				display: block;
				font-size: 16px;
				height: 43px;
				line-height: 43px;
				padding: 0 7px;
				position: relative;
				white-space: nowrap;
			}

			.space-bottom {
				margin-bottom: 20px;
			}
		
			.new_teambox_teamFlag {
				float: left;
				margin-right: 10px;
				margin-top: -2px;
			}

			@media (min-width: 767px) {
				.mobile-screen {
					display: none;
				}

			}

			@media (max-width: 766px) {
				.desktop-screen {
					display: none;
				}

				.container-fluid {
					margin-top: 40%;
				}

				.img-fluid,
				.img-thumbnail,
				.wp-caption img {
					height: 232px;
					width: -webkit-fill-available;
				}

				.upcoming-event {
					margin-top: 230px;
				}

				.upcoming-event-description {
					font-weight: 700;
					font-size: 1rem;
				}

				.past-event-description {
					font-size: 1rem;
				}

				.past-event-name {
					font-size: 1.8rem;
				}

				.upcoming-event-name {
					font-size: 1.8rem;
				}

				.first-img {
					width: -webkit-fill-available;
					margin-left: 15px;
					margin-right: 15px;
					height: 60%;
				}

				.event-name-mobile {
					margin-top: 10px;
				}

				.event-description span {
					font-weight: 700;
					background-color: #fff;
					color: #4d534a;
					/* font-size: 1rem; */
					font-size: 18px;
					line-height: 1.9rem;
					padding: 0px 6px;
				}

				.event-description {
					width: 98% !important;
					margin-top: 20px;
				}

				.event-name span {
					padding: 0px 5px 5px 5px;
					width: 266px;
					/* width: 71%; */
					font-size: 30px;
				}

				.cb-subnav__link {
					padding: 0px 7px 0px 0px;
				}

				.upcoming-event-description span {
					background-color: #ffffff;
					padding: 5px 5px 5px 7px;
				}

				.past-event-description span {
					background-color: #ffffff;
					padding: 5px 5px 5px 7px;
				}

			}

			@media (max-width: 991px) and (min-width: 768px) {
				.mobile-screen {
					display: none;
				}

				.first-section-image {
					height: 45vh;
				}

				.past-event-name {
					font-size: 2rem;
					font-weight: 700;
				}

				.upcoming-event-name {
					font-size: 2rem;
					font-weight: 700;
				}

				.first-img {
					width: 100%;
					height: 100%;
					object-fit: cover;
				}

				.event {
					transform: translateY(-121%);
					left: 2%;
				}

				.event-name span {
					padding: 4px 2px 8px 8px;
					display: inline-block;
					/* width: 412px; */
					width: 71%;
					font-size: 46px;
				}

				.event-description {
					width: 69% !important;
				}

				.event-description span {
					font-size: 22px;
					line-height: 35px;
				}
			}