html{
      -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
body{
padding: 0px;
margin: 0px;
background-color: #fff;  
font-family: "manofa", sans-serif;
font-display: swap;
src: url("https://use.typekit.net/...") format("woff2");
font-size: 100%;
color: #000;
width: 100%;
height: auto;
-webkit-font-smoothing:antialiased;
}
.manofa_regular_400{    
font-family: "manofa", sans-serif;
font-weight: 400;
font-style: normal;
}

ul,li{
    padding: 0px;
    margin: 0px;
    list-style: none;
}
*, *:before, *:after{
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit;
}
a, ins {
    text-decoration: none;
}
#overallwrapper{
width: 100%;
height: auto;
background-color: #fff;
/*min-width: 1280px;*/
}
img{
    max-width: 100%;
    max-height: 100%;
}
input, textarea{
   /* -webkit-appearance: none;*/
    /*-moz-appearance: none;*/
    -webkit-box-shadow:none;
    -webkit-box-sizing: border-box;
    font-family: 'Open Sans', sans-serif;
    font-size: 100%;
}
select{
    -webkit-appearance: none;
    -moz-appearance: none;
    -webkit-box-shadow:none;
    -webkit-box-sizing: border-box;
    font-family: 'Open Sans', sans-serif;
    font-size: 100%;
}

.gradient-border {
  position: relative;
  color: #fff;
  z-index: 0;
  overflow: hidden;
}

.gradient-border::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 1.72px; /* border thickness */
  border-radius: inherit;
  background: linear-gradient(
    135deg,
    #35EBFF 12%,
    #00FF87 29%,
    #05F0FF 51%,
    #953BFF 71%,
    #FF2882 89%,
    #FF6900
  );
  
  /* Mask to keep gradient only on the border area */
  mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  mask-composite: exclude;
  -webkit-mask-composite: xor;
  
  pointer-events: none;
  z-index: -1;
}
  .figma-glass-advanced {
    position: relative;
    width: 100%;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.01);
    backdrop-filter: blur(5px) saturate(100%) brightness(100%);
    -webkit-backdrop-filter: blur(12px) saturate(200%) brightness(110%);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55), inset 0 0 30px rgba(255, 255, 255, 0.01);
    border: 1px solid rgba(255, 255, 255, 0.1);
    overflow: hidden;
  }
.borderStroke-radius{
border-radius: 6px;
}
.borderStroke{
border: 1.72px;
}
.btnYello{
background:#FFE500;  
}
.btnBlue{
    background: #00FFFF;
}
.btnPadding{
  padding: 10px 20px;
}
.fontSize90{
 font-size: 90%;  
}
.fontSize100{
 font-size: 100%;  
}
.fontSize110{
 font-size: 110%;  
}
.fontSize150{
 font-size: 150%;  
}
.fontSize170{
 font-size: 170%;  
}
.fontSize200{
 font-size: 200%;  
}
.fontSize250{
 font-size: 250%;  
}
.fontSize300{
 font-size: 250%;  
}
.colorTxtBlueA{
  color: #012176;
}
.colorTxtWhite{
  color: #fff;
}
.colorTxtBlueB{
  color: #14FFF3;
}
.colorTxtYello{
    color: #FFE500;
}
.heroHeight{
height: auto;    
}
.blockSection{
 padding: 50px 10%;   
}
.blockSectionTit{
 padding: 10px 0px 
}
.blockSectionBody{

}
#blockSectionInner{
    
}

.flexA{
display: flex;
justify-content: space-between;
}
.genInputText{
   /* -webkit-appearance: none;*/
    /*-moz-appearance: none;*/
    box-shadow:none;
    box-sizing: border-box;
    font-size: 100%;
width: 100%;
outline: none;
border:none;
color: #fff;
padding: 5px;
}
.genInputSubmit{
   /* -webkit-appearance: none;*/
    /*-moz-appearance: none;*/
    box-shadow:none;
    box-sizing: border-box;
    font-size: 100%;
width: 100%;
border:none;
outline: none;
}

.clearfix:before, .clearfix:after{
display:block;
content:" ";
}
.clearfix:after {
clear:both;
}
.clear{
*zoom:1;
}
.universalText{
height: 30px;
    width: 100%;
    border-radius: 3px;
    border: none;
    padding: 0 18px;
    color: #0c0c17;
    font-size: 90%;
    -webkit-font-smoothing: antialiased;
    -webkit-box-shadow: none;
    -webkit-appearance: none;
    box-shadow: none;
    outline: none;
    background: none;
}

.genImage{
background-position: center;
background-size:cover;
background-attachment: scroll;
background-repeat: no-repeat;  
}
/*General styles ends here*/
/*icomoon fonts end here*/
#desktopHeader{
display: none;  
}

#mobileHeader{
        display: flex;
        width: 100%;
        height: auto;
        padding: 50px 10% 20px 10%;
}
#LeftM{
width: 130px;
height: auto;
align-items: center;
}
#logo{
width: 90px;
display: flex;
justify-content: left;
align-items: center; 
}
#styleMenu{
color: #fff;
}
#menu{
width: 100%;
padding: 20px 10%;
flex-direction: column;
align-items: center;
}
.styleMenu{

}
#desktopHeaderR{
 width: 50%;
height: auto; 
justify-content: right;  
}
#menudrop{
width:auto;
}
#mobile_menu{
    color: #000;
    cursor: pointer;
    align-self: center;
}

#menu_inner_1{
width: 24px;
    height: 2px;
    background: #fff;
    margin: 3px 0px;
    transition: all linear .3s;
    position: relative;
}
#menu_inner_2{
width: 24px;
    height: 2px;
    background: #fff;
    margin: 3px 0px;
    transition: all linear .3s;
    position: relative;
}
#menu_inner_3{
width: 24px;
    height: 2px;
    background: #fff;
    margin: 3px 0px;
    transition: all linear .3s;
    position: relative;
}
#menu_name{
float: left;
font-size: 90%;
padding-left: 10px;
}

#cp{
position: absolute;
    top: 120px;
    width: 100%;
    display: flex;
    height: 0px;
    overflow: hidden;
    transition: all 0.3s linear 0s;
    text-align: left;
    z-index: 300;
    flex-direction: column;
justify-content: normal;
padding: 0px;
background: #fff;
}

#cp a{
letter-spacing: 2px;
    width: 100%;
    font-size: 90%;
    text-transform: uppercase;
    -webkit-font-smoothing: antialiased;
    color: #000;
    padding:10px 0px;
     margin:5px 0px; 

}
/*pagehero styles start here*/
#MainHero{

}
#OtherPageHero{
height: auto;
}
#otherPageHeroLay{
 width: 100%;
 height: 100%;   
 background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.3));   
}
#OtherPageTitle{
padding: 100px 10%;
}
/*Header sections ends here*/
/*PageHero styles ends here*/

/*Homepage styles starts here*/
#comingFixtures{
width: 80%;
padding: 40px 2%;
height: 150px;
margin: 10px 10%;
justify-content: left;
align-items: center;
}
#weAllPlayHero{
        font-size: 350%;
        padding: 50px 10%;
        text-align: center;
        width: 50%;
        margin: auto;
}
#registerHero{
padding: 60px 10% 30px 10%;
flex-direction: column;
text-align: center;
}
#countDownWrap {
margin-bottom: 50px;
margin-top: 30px;
}
.timerStyle{
font-size: 250%;
}
.heroRegBtn{
        padding: 20px 10px;
        text-align: center;
        width: 80%;
        margin: auto;
        justify-content: center;
}
.styleTimeTage{
 font-size: 80%;   
}
.blkSecBInnerScroll{
            width: 100%;
        height: auto;
        padding: 20px 0px;
        justify-content: flex-start;
        align-items: stretch;
        overflow-x: scroll;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
}
.blkSecBInnerScroll::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for Firefox */
.blkSecBInnerScroll {
    scrollbar-width: none;
}
.blkSecListWrap{
     width: 220px;
        min-width: 220px;
        background-color: #ffffff;
        color: #333;
        margin-right: 2%;
        border-radius: 10px;
        box-shadow: 0px 0px 10px rgba(0, 0, 0, .1);
        transition: all 
linear .3s;
}
.blkSecList{
    width: 100%;
    height: 300px;
    border-radius: 10px;
}
.blkSecListTitLay{
    width: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.3));
    border-radius: 10px;
    color: #fff;
    position: relative;
}
.blkSecListTit{
position: absolute;
width: 100%;
bottom: 10px;
padding: 10px;
}
.blkSecListWrap{
      width: 2220px;
      min-width: 220px;
        background-color: #ffffff;
        color: #333;
        margin-right: 2%;
        border-radius: 10px;
        box-shadow: 0px 0px 10px rgba(0, 0, 0, .1);
        transition: all 
linear .3s;   
}
.blkSecBInnerBlog{
            width: 100%;
        height: auto;
        padding: 20px 0px;
        justify-content: space-between;
   
}

.blkSecListWrapBlog{
       width: 20.5%;
        background-color: #ffffff;
        color: #333;
        border-radius: 10px;
        box-shadow: 0px 0px 10px rgba(0, 0, 0, .1);
        transition: all 
linear .3s;     
}
#mainBlog{
      width: 52%;
        background-color: #ffffff;
        color: #333;
        margin-right: 2%;
        border-radius: 10px;
        box-shadow: 0px 0px 10px rgba(0, 0, 0, .1);
        transition: all 
linear .3s;      
}
.blockRegClub{
 width: 100%;
 margin: 50px auto;   
border-radius: 10px;
flex-direction: column;
}
.blockRegClubLay{
    flex-direction: column;
    border-radius: 10px;
     padding: 50px 40px;  
 background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.3));   
}
.blockRegClubL{
color: #fff;
}
.blockRegClubLBig{

}
.blockRegClubLSmall{
  width: 80%;  
}
.blockRegClubR{
  align-items: center;  
  margin-top: 100px;
}
.blksponsorWrapper{
width: 100%;    
margin: auto;
justify-content: space-around;
align-items: center;
}
.blksponsorWInner{
 width: 30%;   
}
.weallplayHome{
align-items: center;
}
.weallplayL{
width: 100%;
}
.weallplayLTit{
color: #FFE500;
}
.weallplayLBody{
margin: 50px 0px;
}
.weallplayLBtn{
justify-content: left;
}
.weallplayR{
width: 50%;   
display: none; 
}
.blockJerseyWrap{
flex-direction: column;
}
.blockJerseyWL{
width: 100%;
margin-bottom: 10px;
}
.blockJerseyWR{
 width: 100%;   
         justify-content: flex-start;
        align-items: stretch;
        overflow-x: scroll;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
}
.blockJerseyWR::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for Firefox */
.blockJerseyWR {
    scrollbar-width: none;
}
.blockJerseyWRList{
width: 30%;
border-radius: 10px;
        width: 2220px;
        min-width: 220px;
        margin-right: 2%;
}
.blockJerseyWRLImg{
    height: 250px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.blockJerseyWRLDesc{
    padding: 20px;
    background-color: #00FFFF;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.priceBtnHome{
padding-top: 10px;
}
.priceBtnBuy{

}
.footerSection{
width: 100%;    
}
.blkfooter{
width: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.3));
padding: 100px 10%;
}
.blkfooterInner{
 width: 100%;   
}
.blkfooterINewsLetter{
padding: 20px 10px ;
align-items: end;
}
.blkfooterINewsL{
width: 70%;
}
.footerInput{
   background: none; 
   border-bottom: 1px solid #eee;
}
.blkfooterISmall{
    margin: 20px 0px;
}
.blkfooterINewsR{
  width: 25%;  
}
/*Homepage styles ends here*/

/*about styles starts here*/
.aboutSection{
 padding: 100px 10%;       
}
.genBlockAlignBody{

}
.genBlockAlignTit{
 margin: 50px 0px;   
}
.genBlockAlignImage{
 width: 100%;
 height: 300px;
 margin-top: 50px;  
 border-radius: 10px; 
}
.genImageTwo{
width: 48%;
}
/*about styles ends here*/
/*club styles starts here*/
.clubSection{
 padding: 100px 10%;       
}
.clubSectionDBList{
justify-content: left;
margin-bottom: 100px;
}
.clubSectionList{
 width: 30%;
 margin-top: 20px;  
 margin-right: 20px; 
 text-align: center;
 align-items: center;
 flex-direction: column;
 justify-content: space-between;
}
.clubSectionDBLImg{
width: 150px;
}
/*club styles ends here*/