/*90%*/
    @media (width: 1777.79px){
        .nav-ul-menu {
            margin-top: 1px !important;
        }
    }
    /*75%*/
    @media (width: 2133.32px){
        .nav-h3-1 {
            line-height: 1.08 !important;
            top: 5px !important;
        }
    }
    /*67%*/
    @media (width: 2400px){
        .nav-h3-1 {
            top: 4px !important;
        }
    }
    /*110%*/
    @media (width: 1454.53px){
        .nav-h3-1 {
            line-height: 1;
            top: 4px !important;
        }
    }
    /*125%*/
    @media (width: 1280px) {
        .menu>.button_top>a {
            display: flex;
        }
        .nav-h3-1 {
            line-height: 1.06 !important;
            top: 4px !important;
        }
    }
    /*133%*/
    @media (width: 1199.99px) {
        .menu>.button_top>a {
            display: flex;
        }
        .nav-h3-1 {
            top: 4px !important;
        }
    }
    /*140%*/
    @media (width: 1142.86px) {
        .menu>.button_top>a {
            display: flex;
        }
        .nav-h3-1 {
            top: 5px !important;
        }
    }
    /*150%*/
    @media (width: 1066.67px) {
        .menu>.button_top>a {
            display: flex;
        }
        .nav-h3-1 {
            top: 5px !important;
        }
    }
	.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;
	}


   
			/* 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: 2%;
			}

			@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;
			}

			.rectangle-box {
				margin-top: -10px !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: 49px;
				/* 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;
				}
			}
	
			@media (min-width: 1300px) {
				.hero-sec-div-one {
					max-width: 1396px;
				}
			}

			@media (min-width: 740px) {
				.hero-sec-div-one {
					border-left: 1px solid var(--article-border);
					border-bottom: 1px solid var(--article-border);
					border-right: 1px solid var(--article-border);
				}
			}
		

            
				.card-1 {
					background: linear-gradient(45deg, #e73e5d, #ff7f7f);
				}

				.card-2 {
					background: linear-gradient(45deg, #DEA232, #FFE28A);
				}

				.card-3 {
					background: linear-gradient(45deg, #951c55, #ff77cd);
				}

				.card-4 {
					background: linear-gradient(45deg, #FD5A06, #FF9900);
				}

				.card-5 {
					background: linear-gradient(to bottom, #E27A01, #DEA232);
				}

				.card-6 {
					background: linear-gradient(45deg, #9e1d0a, #f03917);
				}

				.card-7 {
					background: linear-gradient(45deg, #F03917, #ff967e);
				}

				.card-8 {
					background: linear-gradient(45deg, #9e1d0a, #fa6057);
				}

				.card-9 {
					background: linear-gradient(45deg, #e27a01, #ffd25a);
				}

				.card-10 {
					background: linear-gradient(45deg, #3b0844, #ff63ed);
				}

				.card {

					border-radius: 10px;
					overflow: hidden;
					box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
					display: flex;
					width: 85%;
					margin-bottom: 10px;
					margin: 11px 20px;
					flex-direction: column;
				}

				.card img {
					width: 100%;

					max-width: none;
				}

				.card-content {
					padding: 15px;
				}

				.card h3 {
					margin: 0 0 10px;
					font-size: 18px;
					color: #fff;
				}

				.card p {
					margin: 0;
					font-size: 14px;
					color: #333;
				}
	
				.card-row {
					margin-top: 6px;
				}

				.col-md-4 {
					display: flex;
					justify-content: center;
					padding: 0px;
					cursor: pointer;
				}

				.animated-image-card {
					width: 100%;
					overflow: hidden;
					position: relative;
				}

				@media (max-width: 768px) {
					.card-wrapper {
						flex-direction: column;
					}

					.card-row {
						gap: 20px;
						padding: 0px;

					}

					.card {
						width: 100%;
					}
				}

				.card-wrapper {
					display: flex;
					gap: 15px;
					padding: 0;

				}

				.card-wrapper>.col-md-4 {
					flex: 1 0 0;
					transition: flex 0.4s ease;
				}

				.card-wrapper>.col-md-4 {
					flex-grow: 1;
					transition: flex-grow 0.6s ease, width 0.6s ease;
				}

				.card-wrapper>.col-md-4:hover {
					flex-grow: 6;
					width: 100%;
				}


				.card-7 img {
					height: 214px;
				}

				.card-8 img {
					height: 214px;
				}

				.card-9 img {
					height: 214px;
				}

				.card-10 img {
					height: 214px;
				}

				.card-9 {
					height: 100%;
				}

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

					overflow: hidden;
				}

				.original-img,
				.animation-img {
					position: absolute;
					width: 100%;
					height: 100%;
					background: #fff;
					transition: all 0.8s ease;
				}

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

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

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

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


				.rivax-categories-accordion.layout-horizontal .image-wrapper {
					height: 208px;
				}

		

				.card-h3 {
					font-family: 'Ultimate Battle', sans-serif;
				}

				.card-p {
					color: #fff !important;
				}

				/* this css for discription  */
				.asm-finances-col.extra-space {
					margin-bottom: 400px;
					transition: margin-bottom 0.5s ease-in-out;
					/* Adjust the time and easing as needed */
				}

				.rectangle-box {
					display: none;
					/* Initially hidden */
					width: 0;
					height: 0;
					max-height: 400px;
					border-left: 20px solid transparent;
					/* Makes the left side of the triangle */
					border-right: 20px solid transparent;
					/* Makes the right side of the triangle */
					border-bottom: 20px solid #0084C5;
					/* Color of the triangle */
					margin: 0px auto;
					/* Center horizontally by auto margin */
					position: relative;
				}

				.fa-x {
					width: 40px;
					height: 40px;
					color: #999;
				}

				.asm-finances {
					display: flex;
					flex-wrap: wrap;
					gap: 20px;
					position: relative;
					margin-top: 10px;
				}

				.asm-finsn {
					position: relative;
					width: 300px;
				}

				.images {
					position: relative;
					cursor: pointer;
				}

				.images img {
					width: 100%;
					display: block;
					border-radius: 10px;
				}

				.images-name {
					position: absolute;
					bottom: 0;
					left: 0;
					right: 0;
					font-size: 18px;
					background-color: rgba(0, 0, 0, 0.4);
					color: #fff;
					text-align: center;
					padding: 5px 0;
					font-size: 14px;
					border-bottom-left-radius: 10px;
					border-bottom-right-radius: 10px;
				}

				.img-description p {
					width: 90%;
					font-weight: 400;
					font-size: 16px;
					line-height: 22px;
				}

				.img-description h3 {
					font-weight: 300;
					font-size: 24px;
					margin-bottom: 10px;
					color: #6c6c6c;
				}

				.img-description {
					display: none;
					position: relative;
					/* position: relative; */
					top: 100%;
					/* left: 0%; */
					width: 100%;
					background-color: #fff;
					color: #999;
					padding: 20px;
					box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
					/* border-radius: 5px; */
					/* text-align: center; */
					font-size: 14px;
					z-index: 10;
					border-top: 3px solid #0084C5;
					transform: translateX(-50%);
					opacity: 0;
					animation: slideUp 0.5s forwards;
				}

				@keyframes slideUp {
					from {
						transform: translateY(20px);
						opacity: 0;
					}

					to {
						transform: translateY(0);
						opacity: 1;
					}
				}

				.img-description.active {
					display: block;
				}

				.close-icon {
					position: absolute;
					top: 5px;
					right: 10px;
					background: none;
					border: none;
					font-size: 18px;
					cursor: pointer;
				}

				@media (max-width: 767px) {
					.asm-finsn {
						position: relative;
						width: 350px;
					}
				}

				@media (min-width: 768px) and (max-width: 1050px) {
					.asm-finsn {
						position: relative;
						width: 500px;
					}
				}