:root {
--themecolor1: #1F1F1F;
--themecolor2: #001b7c;
--themecolor3: #fff;   
--themecolor4: #00f0b5;
--themecolor6: #022D2D;    
--themecolor7: #F5F5F5;  
--themecolor8: #000000;   
--themecolor9: #011784; 
--themecolor10: #004899; 
--text-colordark: #333333;
--font-face1: "Poppins", sans-serif !important;
--outline-color: #ccc;

}

body {font-family: 'Poppins', sans-serif;margin: 0;overflow-x: hidden;padding: 0;}
.bluebg{background: var(--themecolor2);}
.blackbg{background: var(--themecolor1);}
.graybg{background: var(--themecolor7) !important;}
.greenbg{background: var(--themecolor4);}
.darkbluebg{background: var(--themecolor9);}
.lightbluebg{background: var(--themecolor10);}
.img-bg{background: #E5EDF5;}
.color-1{color:var(--themecolor8) ;}
.w-200{width: 200px;}
.blackrgb-70 {background: rgba(0, 0, 0, 0.7);padding: 3px 10px;border-radius: 4px;display: flex;}
.showtop {position: absolute;top: 0;padding: 10px;}
.fs-w1 {font-weight: normal;}
.fs-w2 {font-weight: 300;}
.fs-w3 {font-weight: 600;}
.fs-12 {font-size: 12px;}
.fs-14 {font-size: 14px;}
.fs-16 {font-size: 16px;}
.fs-18 {font-size: 18px;}
.fs-20 {font-size: 20px;}
.fs-24 {font-size: 24px;}
.fs-28 {font-size: 28px;}
.fs-30 {font-size: 30px;font-weight: 500;}
.fs-32 {font-size: 32px;}
.fs-34 {font-size: 34px;}
.fs-36 {font-size: 36px;}
.fs-48 {font-size: 48px;}
.fs-40 {font-size: 40px;}
h1 { font-weight: 500;
font-size: 48px;
color: var(--themecolor2);
}
h2 { font-weight: 500;
font-size: 46px;
color: var(--themecolor2);
}
h3 { font-weight: 500;
font-size: 20px;
color: var(--themecolor8);
}
.py-100{padding: 80px 0px;}
.fw-600{font-weight: 600;}
.fw-bold{font-weight: bold;}

.top-bar {
color: var(--themecolor3);
font-size: 12px;
padding:0px 0px ;
}
.top-bar a {
color: var(--themecolor3);
text-decoration: none;
margin: 0 3px;
}
.nav-container a {
color: white;
text-decoration: none;
padding: 9px 10px;
text-transform: uppercase;
display: inline-block;
--hover: var(--themecolor4);
transition: 0.25s;
margin: 0 0px;
}
.nav-container a:hover,
.nav-container a:focus {
box-shadow: inset 0 -3.25em 0 0 var(--hover);
color: #000;
}
.main-nav {
background: var(--themecolor3);
border-bottom: 2px solid #ddd;
}
.main-nav .nav-link {
color: var(--themecolor1);
font-weight: 500;
}
.main-nav .nav-link:hover {
color: var(--themecolor2);
}
.wrapper {
padding: 0 9%;
}
.w-90{ width: 90%;}
.w-10{width: 10%;}
.next-match {
background:  var(--themecolor2);
color: var(--themecolor3);
padding: 10px 11px;
overflow: hidden;
position: relative;
display: flex;
width: 100%;
}
.next-match-slider .slick-dots li button:before {
color: red;
opacity: 0.3;
}
.next-match-slider .slick-dots li.slick-active button:before {
opacity: 1;
color: red;
}

.slick-prev, .slick-next {
font-size: 24px;
color: #000;
z-index: 1;
}


.flag {
width: 30px;
margin-right: 5px;
}

.dots .dot {
cursor: pointer;
opacity: 0.4;
transition: opacity 0.3s;
width: 17px;
height: 17px;
}

.dots .dot.active {
opacity: 1;
}



nav.navbar {
z-index: 1001;
padding: 0;
}

.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
z-index: 1045;
display: none;
}

.overlay.active {
display: block;
}

/* Updated Search Panel */
.search-panel {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background:var(--themecolor3);
color: #000;
z-index: 1050;
display: none;
flex-direction: column;
padding: 50px 20px;
justify-content: center;
align-items: center;
text-align: center;
}

.search-panel.active {
display: flex;
}

.search-panel h1 {
font-size: 2.5rem;
font-weight: 500;
color: #333;
margin-bottom: 20px;
}

.search-panel .input-wrapper {
position: relative;
width: 100%;
max-width: 800px;
margin-bottom: 40px;
}

.search-panel input {
width: 100%;
padding: 15px 50px 15px 0;
font-size: 24px;
border: none;
border-bottom: 2px solid #7c7c7c;
background: transparent;
outline: none;
color: #333;
}

.search-panel .input-wrapper i {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
font-size: 20px;
color: #999;
}

.search-links {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 60px;
color: #333;
}

.search-links div {
min-width: 200px;
}

.search-links strong {
color: #ff0033;
display: block;
margin-bottom: 10px;
}

.search-links a {
display: block;
color: #333;
text-decoration: none;
margin-bottom: 8px;
}

.close-btn {
position: absolute;
top: 20px;
right: 30px;
font-size: 24px;
color: #333;
cursor: pointer;
}


.fullscreen-menu {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: var(--themecolor1);
color:var(--themecolor3);
z-index: 1040;
display: none;
flex-direction: row;
justify-content: space-between;
padding: 40px;
animation: fadeIn 0.5s ease;
/*! align-items: center; */
padding: 50px 28%;
}

.fullscreen-menu.active {
display: flex;
}

.menu-left {
flex: 1;
padding: 0 7%;
border-right: 1px solid #2f2f2f;
min-width: 507px;
max-width: 507px;
margin: auto 0;
border-left: 1px solid #2f2f2f;
}

.menu-left a {
display: block;
font-size: 39px;
color: var(--themecolor4);
margin-bottom: 11px;
text-decoration: none;
border-bottom: 1px solid #2f2f2f;
padding-bottom: 10px;
transition: 0.3s;
}

.menu-left a:hover {
color:var(--themecolor3);
}

.menu-right {
flex: 1;
display: none;
flex-direction: column;
transition: transform 0.4s ease, opacity 0.4s ease;
transform: translateX(100%);
opacity: 0;
position: absolute;
top: 0;
right: 0;      
margin: auto;
width: 100%;
background: var(--themecolor1);
padding: 40px;
}

.menu-right.active {
display: flex;
transform: translateX(0);
opacity: 1;
}

.menu-right a {
color:var(--themecolor3);
font-size: 18px;
margin-bottom: 15px;
text-decoration: none;
}

.fullscreen-menu .close-btn {
position: absolute;
top: 20px;
right: 30px;
font-size: 24px;
color: var(--themecolor3);
cursor: pointer;
}

.back-btn {
font-size: 18px;
margin-bottom: 20px;
color: var(--themecolor3);
cursor: pointer;
}

@keyframes fadeIn {
from { opacity: 0; transform: translateY(-20px); }
to { opacity: 1; transform: translateY(0); }
}

.slider-wrapper {
position: relative;
}




.clientimg {
text-align: center;
border: 1px solid #ccc;
width: 93%;
display: flex;
padding: 16px;
background-color: var(--themecolor3);
}
#clientSwipera2 .clientimg{min-height: 155px;}
.clientimg img {
display: block;
margin: auto;
}


.match-card {
margin: 30px auto;   
overflow: hidden;

}
.match-header {    
padding: 12px 15px;
display: flex;
justify-content: space-between;

font-size: 14px;
}
.match-content {
background-color: var(--themecolor10);
color: var(--themecolor3);
text-align: center;
padding: 29px 10px;
}
.teams {
display: flex;
justify-content: space-between;
align-items: center;
}
.team {
width: 40%;
}
.team img {
height: 50px;
margin-bottom: 8px;
}
.vs {
width: 20%;

}
.score {
margin-top: 9px;
}
.overs {
font-size: 16px;
}
.result-text {
margin-top: 20px;
font-size: 14px;

}
.upcomingbox{font-size: 18px;font-weight: 500;line-height: 25px;}
.btn-hover {font-size: 18px;font-weight: 500;cursor: pointer;height: 55px;text-align: center;
border: none;background-size: 300% 100%;border-radius: 0;moz-transition: all .4s ease-in-out;
-o-transition: all .4s ease-in-out;-webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;
padding: 16px 47px;text-decoration: none;}
.btn-hover:hover {background-position: 100% 0;moz-transition: all .4s ease-in-out;-o-transition: all .4s ease-in-out;
-webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;}
.btn-hover:focus {outline: none;}
.btn-hover.color-1 {background-image: linear-gradient(to right, #16E4B8, #16E4B8, #04aa86, #04aa86);}


.btn-hover.color-3 {background-image: linear-gradient(to right, #1e5aa0, #2e619c, #004899, #004899);}


/*--- btn-4 ---*/
.btn-4 span {
color: rgb(28, 31, 30);
background-color: rgb(22, 228, 184);
transition: 0.3s all;
}

.btn-4::before,
.btn-4::after {
width: 0; height: 2px;
background-color: rgb(22, 228, 184);
z-index: 2;
transition: 0.3s all;
position: absolute;
content: "";
}


.btn {
position: relative;
display: inline-block;
width: auto; height: auto;
border: none;
cursor: pointer;
overflow: hidden;
padding: 4px 0;
transition: 0.3s all;
border-radius: 0;
}
.btn span {         
position: relative;
display: inline-block;
font-size: 18px;
font-weight: 600;
top: 0; left: 0;
width: 100%;
padding: 16px 45px;
transition: 0.5s all;
}


/* 17. hover-border-7 */
.btn.hover-border-7::before,
.btn.hover-border-7::after {
bottom: 4px;  position: absolute;
content: "";
/* transition: width 0.6s 0.35s ease-out; */
}
.btn.hover-border-7::before {
right: 50%;
}
.btn.hover-border-7::after {
left: 50%;
}
.btn.hover-border-7:hover::before,
.btn.hover-border-7:hover::after {
width: 100%;  position: absolute;
content: "";
transition: width 0.5s ease-in;   
}

.btn.hover-border-7 span::before,
.btn.hover-border-7 span::after {
width: 0%; height: 0%;
background: transparent;
opacity: 0;
z-index: 2;  position: absolute;
content: "";
transition: width 0.2s ease-in, height 0.15s 0.2s linear, opacity 0s 0.35s;
}
.btn.hover-border-7 span::before {
bottom: 0px; left: 0px;  position: absolute;
content: "";
border-left: 2px solid rgb(22, 228, 184);
border-top: 2px solid rgb(22, 228, 184);
}
.btn.hover-border-7 span::after {
bottom: 0; right: 0;  position: absolute;
content: "";
border-right: 2px solid rgb(22, 228, 184);
border-top: 2px solid rgb(22, 228, 184);
}
.btn.hover-border-7 span:hover::before,
.btn.hover-border-7 span:hover::after {
width: 50%; height: 100%;
opacity: 1;  position: absolute;
content: "";
transition: height 0.2s 0.2s ease-in, width 0.2s 0.4s linear, opacity 0s 0.2s;   
}
.btn-4:hover span {
background: transparent;
color: #fff;
}
.btn-4.hover-color:hover span {
background: transparent;
color: #000;
}


.btn-1 {
margin: 0;padding: 0;
}
.divider {
opacity: 0.5;
}
.btn-1 span {
color: rgb(0, 0, 0);
border: 2px solid rgb(22, 228, 184);
transition: 0.2s 0.1s;
padding: 6px 10px;
font-size: 12px;
margin-left: 0px;
font-size: 14px;
font-weight: 500;
border-radius: 0;
}
.btn.hover-filled-slide-up::before {
top: 0;
left: 0;position: absolute;
content: "";
right: 0;
height: 100%;
width: 100%;
}
.btn-1::before {
background-color: rgb(22, 228, 184);
transition: 0.3s ease-out;position: absolute;
content: "";
border-radius: 0;
}
.btn.hover-filled-slide-up:hover::before {
height: 0%;position: absolute;
content: "";
}

.btn-1:hover span{
color: #000;
}


.btn-2 span {
border: 2px solid #1e5aa0;
color: #fff;
}

.btn-2::before {
background-color: #1e5aa0;

}
/* Table start */
.standings{background:var(--themecolor10) url(../images/standings.png)}
.dfd{background:var(--themecolor10) url(../images/dfd.jpg)}

.points-table {
margin: 20px auto;
}

table {
width: 100%;
border-collapse: collapse;
border-radius: 0px;
overflow: hidden;
}

thead {
background-color: #001f72;
color: white;
}

th, td {
padding: 12px;
text-align: left;
font-size: 18px;
font-weight: 400;
}

td{
color: var(--themecolor8);
}

td:first-child {
text-align: center;
}

tbody tr:nth-child(even) {
background-color: #f3f9ff;
}
tbody tr:nth-child(odd) {
background-color: #fff;
}

/* CARD LAYOUT ON MOBILE */
@media screen and (max-width: 768px) {
table, thead, tbody, th, td, tr {
display: block;
}

thead {
display: none;
}

tbody tr {
margin: 0px 0 18px;
border: 1px solid #007bff;
border-radius: 6px;
background: white;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
padding: 10px;
}

tbody td {
padding: 8px 12px;
font-size: 14px;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #eee;
}

tbody td:last-child {
border-bottom: none;
}

tbody td::before {
content: attr(data-label);
font-weight: bold;
color: #001f72;
}
}
/*end Table start */

/*2024 number start */

.teammemberbg{background:var(--themecolor10) url(../images/teammeberbg.jpg);}
.iscomingbg{background:var(--themecolor10) url(../images/iscoming-bg.jpg);}
.innerh-bg{background: url(../images/innerh-bg.jpg) no-repeat; background-size: cover;}
.slider-container {
margin: 0px auto;
padding: 0;
}
.number2024 {
overflow: hidden;position: relative;
}
.number2024 .btn-wrap{
display: none;
}


.card {
background-color: #003087;
border: 5px solid #ffffff;
border-radius: 0;
overflow: hidden;
color: #fff;
text-align: center;
padding: 0;
/*! height: 350px; */
display: flex;
flex-direction: column;
justify-content: space-between;
}

.card .title {
background: #00baff;
padding: 8px 0;
font-weight: 600;
font-size: 33px;
text-transform: uppercase;
}

.card .image-area {
flex-grow: 1;
display: flex;
align-items: center;
justify-content: center;
margin-top: 29px;
position: relative;
}

.card .image-area img {
max-height: 287px;
width: auto;
}

.card .score {
font-size: 48px;
font-weight: 500;
margin-top: 0;
position: absolute;
top: -4px;
right: 24px;
line-height: 1;
}


/* Slick Arrows Customization */
.slick-prev, .slick-next {
z-index: 1;
}

.slick-prev:before, .slick-next:before {
color: var(--themecolor3);
font-size: 30px;
}

.img-hover {overflow: hidden;width: 100%;}
.inner-img {transition: 0.7s;border-radius: 0;}
.inner-img:hover {transform: scale(1.1);}
.vw50{width: 50vw; height: 75px; position: absolute; top: -55px;}

/* Responsive tweaks */
@media (max-width: 768px) {
.card {
height: 300px;
}
.card .title {
font-size: 16px;
}
.card .score {
font-size: 20px;
}
.card .player-name {
font-size: 14px;
}
}

/*2024 end number start */

/* Start Featured Videos */
.videosbg{background: #F5F5F5 url(../images/videosbg.png);}
.standingtablebg{background:  url(../images/standingtablebg.jpg);}

.video-card {position: relative;width: 100%;border-radius: 0;overflow: hidden;}
.video-card img {width: 100%;display: block;}
.label-free {position: absolute;top: 10px;left: 10px;background-color: rgba(0,0,0,0.7);
color: #fff;padding: 4px 10px;font-size: 14px;border-radius: 4px;}
.video-duration {position: absolute;top: 10px;right: 10px;background-color: rgba(0,0,0,0.7);
color: #fff;padding: 4px 8px;font-size: 14px;border-radius: 4px;}
.play-button {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 60px;
height: 60px;background-color: rgba(255,255,255,0.9);border-radius: 50%;display: flex;align-items: center;
justify-content: center;cursor: pointer;transition: background 0.3s ease;}
.play-button:hover {background-color: rgba(255,255,255,1);}
.play-button::before {    content: '';display: block;width: 0;height: 0;border-left: 18px solid black;
border-top: 10px solid transparent;border-bottom: 10px solid transparent;}

/* end Featured Videos */
.latest-images-section {
margin: auto;
}
.latest-newsbg{background: var(--themecolor10) url(../images/latestnews.png);}
.header-row {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}

.images-grid {
display: flex;
flex-wrap: wrap;
gap: 10px;
}

.images-grid a {
flex: 1 1 calc(25% - 10px);
overflow: hidden;
display: block;
transition: transform 0.3s ease;
}


.images-grid img {
width: 100%;
object-fit: cover;
display: block;
}
.sponsors{background: #081E40;}

@media (max-width: 767px) {
.images-grid {
display: block;
}
}

.slick-prev, .slick-next {
background: #00f5c7;
width: 35px;
height: 35px;
border-radius: 50%;
z-index: 1;
}

.slick-prev:before, .slick-next:before {
color: #003973;
font-size: 20px;
}



.header.main-nav.fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 999;
background: white; /* ya apka desired background */
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.f_link li {
line-height: 38px; position:relative;
}
a {
text-decoration: none;
}
.f_link li a {
color: var(--themecolor3);
font-family: var(--font-face1);
font-size: 18px;
transition: all 0.3s ease-in;
position: relative;
}
ul {
padding: 0;
margin: 0;
}
li {
list-style: none;
}
footer { background: #1D1D1F;}
footer h4{font-weight: 600; text-transform: uppercase; }
.quick-links li {padding-right: 3%;
display: inline-block;    line-height: 1 !important;
color: var(--themecolor8);
}
.f_link li a::before {
content: '';
position: absolute;
width: 0;
height: 1px;
background-color: var(--themecolor3);
bottom: -2px;
transition: 0.6s;
left: 0; right: 0;
margin: auto;

}
.f_link li a:hover::before {
width: 97%;
left: 0;
}
.form-control:focus {
border-color: #192020;
}
.quick-links li a{
color: #9B9A9F;transition: all 0.3s ease-in;
}
.quick-links li{
position: relative;
}
.quick-links li::after {
content: "";
width: 1px;
background-color: var(--themecolor3);
opacity: 0.3;
position: absolute;
left: -13px;
height: 26px;
top: calc(64% - 15px);
}
.copyRright {
background: #1D1D1F;
border-top: 1px solid #5e5e5e;
}
.quick-links li:first-child::after{display: none;}
.slide-counter {
position: absolute;
bottom: 355px;
right: 22px;
transform: translateX(-50%);
display: flex;
align-items: center;
gap: 10px;
z-index: 10;
}

.counter-circle {
width: 50px;
height: 50px;
border: 1px solid #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
font-size: 16px;
}

.arrow {
color: #fff;
font-size: 30px;
cursor: pointer;
user-select: none;
}

.list-check {
list-style: none;
padding-left: 0;
}
.list-check li {
position: relative;
padding-left: 38px;
margin-bottom: 25px;
color: var(--themecolor3);
}
.list-check li::before {
content: '';
position: absolute;
left: 0;
color: #00F0FF;
font-size: 18px;
background: url(../images/chekmark.svg);
width: 24px;
height: 23px;
}
.image-frame {
position: relative;
display: inline-block;
}
.image-frame::before, .image-frame::after {
content: '';
position: absolute;
width: 100px;
height: 100px;
background: #00FF94;
}
.image-frame::before {
top: -13px;
left: -13px;
}
.image-frame::after {
bottom: -13px;
right: -13px;
}
.image-frame img {
max-width: 100%;
border-radius: 0;
position: relative;
z-index: 1;
}

.match-banner {
display: flex;
flex-wrap: wrap;
text-align: center;
color: #fff;
}

.pattranbg{	background: url(../images/petranbg.png);}

.left, .center, .right {
flex: 1;
min-width: 20%;
padding: 59px 20px;
}

.left {
background-color: #4300C8; /* Approx Ajman Bolts background */
display: flex;
align-items: center;
justify-content: center;
max-width: 300px;
min-width: 286px;
}

.left img {
max-width: 100%;
height: auto;
}

.center {
background-color: #000;
display: flex;
flex-direction: column;
justify-content: center;
}

.center h2 {
margin-bottom: 10px;
}

.middle-logo {
background-color: #FFD900;
padding: 20px;
color: #000;
font-weight: bold;
display: flex;
width: auto;
align-items: center;
}

.middle-logo h2 {
font-size: 24px;
letter-spacing: 1px;
}

.right {
background-color: #011784;
display: flex;
flex-direction: column;
justify-content: center;
color: #fff;
}

.leftbg_1{background-color: #063558;}
.leftbg_3{background-color: #FF7600;}
.leftbg_4{background-color: #CB8F50;}
.leftbg_5{background-color: #1F1A55;}
.leftbg_6{background-color: #741715;}
.leftbg_7{background-color: #2E2D89;}
.leftbg_8{background-color: #2C104A;}
.right strong {display: block;margin: 10px 0 5px;}
.pos_r{position: relative;}
.nameheadding{position: absolute; bottom: 20px; width: 100%; left: 0; right: 0;}
.nameheaddingoverlay {
background: linear-gradient(180deg,rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.8) 100%);
position: absolute;height: 100%;top: 0;bottom: 0;width: 100%;pointer-events: none;
}

.gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 15px;
}

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

.thumbnail img {
width: 100%;
height: auto;
display: block;
}

.play-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 40px;
color: white;
background: rgba(0, 0, 0, 0.5);
border-radius: 50%;
}

.video-player {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.9);
display: none;
justify-content: center;
align-items: center;
z-index: 1000;
}

.video-player video {
width: 90%;
max-width: 1000px;
}

.video-player .close-btn {
position: absolute;
top: 20px;
right: 30px;
font-size: 30px;
color: white;
cursor: pointer;
z-index: 1001;
}

.contectform {
margin-top: -120px;
padding: 36px 49px;
}

.contectform input{border-bottom: 1px solid #D9D9D9 !important;
border: 0px;border-radius: 0;}
.contectform input:focus{ box-shadow: 0 0 0px;}
.mx-wauto{max-width: 100% !important;}
/**cookies banner **/
.cookies-statement {text-align: left; padding: 12px 50px; position: fixed; bottom: 0; background: #fff; z-index: 9999; box-shadow: 0 5px 13px #292828; width: 100%;}
.cookies-statement .cookies-btn ul li {display: inline-block;/*! padding: 0 5px; */}
.Cookiesclose .icon {width: 25px; height: 25px; position: absolute; right: 10px; top: 10px; background: #BA9C5C; padding: 5px; border-radius: 50%; cursor: pointer; fill: #062360;}
.Cookiesclose .icon {cursor: pointer; fill: #fff;}
.cookies-statement .cookies-btn ul li a {
width: 135px;
}

.cookies-statement h3{font-size:26px; line-height: 30px;}

.Cookies a:hover{color:#1d4368;}
.Cookies p {margin-bottom: 0px; line-height: 22px; font-size: 16px;}

.cookies_container {
width: 100%;
padding: 30px 50px;
position: fixed;
bottom: 0;
left: 0;
background: #fff;
z-index: 9999;
box-shadow: 0 0 26px #ba9c5c;
}
.cookies_container h2 {
font-size: 26px;
line-height: 26px;
font-weight: bold;
}
.cookies_container p {
font-size: 16px;
line-height: 22px;
}

.expanding-nav__main-ul li a:hover{color: #000a69;}

@media (max-width: 1440px) {
.wrapper {
padding: 0 2%;
}
}


@media (max-width: 768px) {
.center h2, .middle-logo h2, .right strong {
font-size: 18px;
}
}


@media (min-width: 768px) {
.menu-right {
position: static;
transform: none;
opacity: 1;
display: none;
}

.menu-right.active {
display: flex;
}

.back-btn {
display: none;
}

}

@media (max-width: 767px) {
.contectform {
margin-top: 0;
padding: 3px 0px;
}
.wrapper {
padding: 0 2%;
}
.py-100 {
padding: 40px 0px;
}
h2 {
font-size: 30px;
}
.story-title {
font-size: 21px;
line-height: 27px;
}
.thumb-slider {
gap: 17px;
margin-top: 0;
position: relative;
bottom: 0;
right: 0;
background: #1f1f1f;
padding: 17px 17px 8px;
}
.slick-dotted.slick-slider {
margin-bottom: 0 !important;
}
.w-90 {
width: 100%;
}
.search-links {
gap: 5px;
}
.search-panel h1 {
font-size: 22px;
}
.card .image-area img {
max-height: 100%;
width: 100%;
}
.card .image-area {
align-items: end;
}
.f_link li {
line-height: 31px;
}
.fs-40 {
font-size: 25px;
}
h1 {
font-size: 31px;
}
.fs-36 {
font-size: 22px;
}
.vw50 {
height: 38px;
top: -26px;
}

.cookies-statement {padding: 12px 10px;}
.Cookies p {margin-bottom: 15px;font-size: 14px;}
.menu-left {
min-width: 100%;
max-width: 100%;

}
.fullscreen-menu {      
padding: 50px 0%;
}
.btn span {
font-size: 16px;
padding: 9px 32px;
}

.btn-2 span, .btn-1 span {
	padding: 9px 10px !important;
	font-size: 13px !important;
}


}
.main-nav {
padding: 0px 0;
}


.cl-logo {
	text-align: center;
	width: 100%;
	font-size: 2.5vw;
	color: #ccc;
	line-height: 111px;
}


@media (max-width: 575px) {
	.cl-logo {	
		font-size: 5vw;
	
	}
.ticker-item {font-size: 11px;}
.flag {width: 22px;}
.w-200 {width: auto;}
.slick-dots li {width: 6% !important;height: 2px;}
.slick-dots {padding: 7px 5% 7px !important;}
.overlay-content {padding: 40px 9px 5px;}
.thumb-slider .thumb span {font-size: 17px;}
.circular-progress {bottom: 102px;right: 15px;left: auto;}
.vs img{
width: 100%;
}
.upcomingbox {
font-size: 14px;
line-height: 16px;
}
.btn-hover {
font-size: 16px;
height: 40px;
padding: 9px 33px;
}
.clientimg img {width: 100%;}
.overs {
font-size: 14px;
}
.points-table {
margin: 10px auto;
}
.menu-left a {
font-size: 24px;
font-weight: 500;
}
.counter-circle {
width: 39px;
height: 39px;
font-size: 12px;
}
.slide-counter {
top: 0;
right: 15px;
transform: translateX(-0%);
}
}

@media (max-width: 520px) {
.nav-container .ph-none{ display: none;}
.nav-container a {
padding: 9px 4px;
}
.middle-logo {width: 100%;}
.middle-logo img{margin: auto;}
.left, .center, .right {
min-width: 100%;
padding: 33px 20px;
}
.left {max-width: 100%;
min-width: 100%;
}
h2 {
font-size: 21px;
}
.f_link li a {
font-size: 16px;
}

}

.border1 {
border: 1px solid #ACABAB;
height: 24px;
}

.slider-container {
position: relative;
/*! max-width: 1200px; */
margin: 0 auto;
/*! padding: 20px; */
}

.main-slider {
position: relative;
margin-bottom: 20px;
}

.slide {
height: 70vh;
background-size: cover;
background-position: center bottom;
position: relative;
}

.slide-counter {
position: absolute;
/*! top: 0%; */
right: 166px;
transform: translateY(-50%);
display: flex;
align-items: center;
gap: 10px;
}

.arrow {
cursor: pointer;
background: none;
border: none;
padding: 5px;
}

.arrow img {
width: 20px;
height: 20px;
/* filter: invert(1); */
}

.counter-circle {
position: relative;
width: 50px;
height: 50px;
}

.counter-circle svg {
position: absolute;
top: -7px;
left: -4px;
width: 57px;
height: 62px;
}

.progress-circle {
fill: transparent;
stroke-width: 5px;
stroke-dasharray: 408; /* 2 * π * 65 */
stroke-dashoffset: 408;
transform: rotate(-87deg);
transform-origin: center;
stroke: #fff;
/*! margin-top: -18px; */
/*! position: relative; */
top: -3px;
}

.progress-circle.animate {
animation: clock-animation 5s linear forwards;
}

.counter-text {
fill: #fff;
font-size: 46px;
/*! font-family: Arial, sans-serif; */
}

@keyframes clock-animation {
0% { stroke-dashoffset: 408; }
100% { stroke-dashoffset: 0; }
}

.circular-progress {
position: relative;
/*! width: 18px; */
height: 76px;
/*! margin: 20px auto; */
font-size: 20px;
display: flex;
color: #fff;
align-items: center;
justify-content: center;
gap: 14px;
}

.circular-progress svg {
width: 18px;
height: 18px;
}

.circular-progress .fill {
fill: #1AFFBA; /* Match the green theme */
stroke: none;
}

.circular-progress .percentage {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 0;
color: #fff;
}

.slide-text {
padding: 0;
border-radius: 8px;
margin-bottom: 20px;
position: relative;
padding-bottom: 33px;
top: -8px;
}

.slide-text .date {   
color: var(--themecolor4);
text-transform: uppercase;
letter-spacing: 1px;
margin-bottom: 2px;
}

.slide-text .headline {

font-size: 40px;
line-height: 48px;
font-weight: 500;
margin: 0px 0;
text-transform: uppercase;
color: var(--themecolor3);
}


.slide-text .description {
font-size: 14px;
color: #ccc;
margin-bottom: 20px;
}

.thumbs {
display: flex;
justify-content: end;
gap: 10px;
padding-top: 50px;
}

.thumb {
width: 136px;
height: 72px;
background-size: cover;
background-position: center;
cursor: pointer;
position: relative;
}

.thumb span {
position: absolute;
bottom: -45px;
left: 5px;
font-size: 26px;
padding: 4px 5px;
border-radius: 2px;
color: var(--themecolor3);
font-weight: 600;
}
.thumb.active span {
color: #ACABAB;
}



/* .thumb.active::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2px;
background: #00cc00;
} */

@media (max-width: 1680px) {
.slide-text {padding-bottom: 16px;}
.slide-counter {bottom: 393px;right: 37px;}
.slide-text .headline {font-size: 36px;}

}
@media (max-width: 1366px) {
.slide-text .headline {
font-size: 32px;
}
}


@media (max-width: 767px) {
.slide-text .headline {
font-size: 20px;
margin-bottom: 6px;
line-height: 25px;
}
.menu-right {height: 100%;}
.slider-container .slick-dots{display: none !important;}
.slide-text {
padding-bottom: 0;
top: 0;
}
.thumb span {
font-size: 18px;
}
.circular-progress {
font-size: 15px;
}
.slide-counter {
position: absolute;
top: 25%;
right: 15px;
transform: translate(0%, -50%);
display: flex;
align-items: center;
gap: 10px;
bottom: inherit;
}

.slider-container .slide {
height: 22vh;

}

.circular-progress {
bottom: 0;
right: 0;
left: auto;

}

.thumbs {
display: flex;
justify-content: end;
gap: 10px;
padding: 20px 0 50px;
}

.counter-circle {
width: 39px;
height: 39px;
font-size: 12px;
}
.counter-circle svg {
position: absolute;
top: -7px;
left: -4px;
width: 44px;
height: 51px;
}
.counter-text {
font-size: 30px;

}
.arrow {

padding: 0px;
}
.main-nav {
	padding: 3px 0;
}
.px-mob{padding: 0 10px;}
.footerlogo {
	width: 171px;
}
.play-button::before {
	border-left: 10px solid black;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
}
.play-button {
	width: 30px;
	height: 30px;

}
.match-card {
	margin: 22px auto;
}
.fs-28 {
	font-size: 20px;
}
.match-header {
	font-size: 13px;
}
.image-frame::after {
	bottom: -14px;
	right: -1px;
}

.image-frame::before {
	top: -13px;
	left: -1px;
}
.image-frame {
	padding: 4px 18px;
}
.list-check li {
	margin-bottom: 10px;
}
.navbar-brand img {
	width: 97px;
	padding: 4px 0px;
}

}

@media (max-width: 379px) {
.slider-container .slide {
height: 38vh;
}
}


@media (min-width: 768px) and (max-width: 1100px) {
	.left {

		min-width: 100%;
	}
	.contectform {
		margin-top: 0;
		padding: 6px 0px;

	}
	.fullscreen-menu {
	  padding: 50px 3%;
	}
	.menu-left {
		padding: 0 5%;
	
		min-width: 391px;
		max-width: 391px;
	}
	.menu-left a {
		font-size: 28px;
	}
	.slide-text .headline {
		font-size: 28px;
		line-height: 34px;
	}
	.slick-dots li {
		width: 56px !important;
	}
	.wrapper {
		padding: 4px 2%;
	}
	.py-100 {
		padding: 40px 0px;
	}
	h2 {
		font-size: 28px;
	}
	.f_link li a {
		font-size: 16px;
	}
	.fs-40 {
		font-size: 33px;
	}

  }