nav.navpaginationflex{height:40px; display:block;}
nav.navpaginationnone{height:1px; display:none;}
.pagination-controls{text-align: center;}


a.pagination-link{font-size:0.9em;margin:0 1px;color:#777}

@media only screen and (min-width :380px){
	a.pagination-link{font-size:1em;}
}
@media only screen and (min-width :400px){
	a.pagination-link{font-size:1.1em;margin:0 2px;}
}
@media only screen and (min-width :500px){
	a.pagination-link{font-size:1.3em;}
}
select.filtersnone{display:none;}


@media only screen and (min-width :900px){
  #billets{padding:0; margin:25px 0 -25px}  
}
#filters .filters-reset{padding:0 0 20px;}
@media only screen and (min-width: 780px){
#filters div, #filters .filters-reset{padding:20px 0;}
}
#filters.filters-open {
    max-height: 500px; /* or a large enough value to contain content */
    opacity: 1;
  }
#filters.filters-closed {
    max-height: 0;
    opacity: 0;
  }




#filters{gap:10px;display: flex;    align-items: stretch;flex-direction: row;
  border:none;flex: 1 1 0;
  border-bottom:  1px solid #ccc;
  padding: 0px;
  width: auto;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;overflow: hidden;
  max-height: 0;
  opacity: 0;
  /*transition: max-height 0.25s ease, opacity 0.25s ease;*/
}
#filters div{flex: 3 1 0;}#filters .filters-reset{flex: 1 1 0;}
#filters div.flextwo,#filters button.flextwo{flex: 2 1 0;}
#filters div.price-filter{flex: 2 1 0;}


#filters select{max-width:none;}

#filters:before {
content: "";
color: #004b95;
font-size: 1.1em;font-weight:bold;
clear: both;
float: none;
display: block;
margin-bottom: 0px;}




button:active,button:focus{color: #4098D8; background:none;padding:0;}

label{text-align:left;font-weight:bold;margin-right:3px;}


.filters-toggle {
	background:none;color:#185c8a;
  border: none;padding:0;
  cursor: pointer;text-decoration:underline;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.filters-toggle:hover {
  color: #4098D8;background:none;
}

.filters-toggle.is-open {
  color: #1f2a4d;background:none;
}


.filters-reset[disabled],
.filters-reset.is-disabled,
.filters-reset[disabled]:hover,
.filters-reset.is-disabled:hover,
#sortselect[disabled],
#sortselect.is-disabled,
#sortselect[disabled]:hover,
#sortselect.is-disabled:hover
{
  opacity: 0.3;
  cursor: default;color:#444;text-decoration: none;
}
#sortselect[disabled],
#sortselect.is-disabled,
#sortselect[disabled]:hover,
#sortselect.is-disabled:hover{
  background-image: linear-gradient(45deg, transparent 50%, #ccc 50%), linear-gradient(135deg, #ccc 50%, transparent 50%), linear-gradient(to right, #ffffff, #ffffff);
}

#sortselect{
    padding: 4px 30px 4px 6px;font-size:16px;min-width:250px;
    appearance: none;
    cursor: pointer;
    color: #000;border: 1px solid #ccc;
    background-image: linear-gradient(45deg, transparent 50%, #ccc 50%), linear-gradient(135deg, #ccc 50%, transparent 50%), linear-gradient(to right, #ffffff, #ffffff);
     background-position: calc(100% - 20px) calc(1em + -2px), calc(100% - 15px) calc(1em - 2px), 100% 0px;
    background-size: 5px 5px, 5px 5px, 2.5em 3.5em;
    background-repeat: no-repeat;
    border-radius: 3px;
}

 #filters select {
	 background-image: linear-gradient(45deg, transparent 50%, #ccc 50%), linear-gradient(135deg, #ccc 50%, transparent 50%), linear-gradient(to right, #ffffff, #ffffff);
	 background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px), 100% 0px;
  /* min-width: 160px;
  padding: 0.4rem 0.75rem;
  border-radius: 999px; */
  border: 1px solid #ccc;
  /* background: #f8fafc;
  font-size: 0.9rem;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease; */
} 
#filters select:hover, #sortselect:hover{
	background-image: linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%), linear-gradient(to right, #ccc, #ccc);
}
#filters select:focus,#sortselect:focus{
	background-image: linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%), linear-gradient(to right, #4098D8, #4098D8);
}
#filters select:focus,#sortselect:focus{
  outline-color: #4098D8;
  
}

.selectedFilter {
  display: inline-flex;
  align-items: center;
  margin:0.3em .3rem 0.3rem 0;
  padding: 0rem .7rem;
  border-radius: 20px;
  font-size: .8rem;color:#4098D8;
  background: #fff;border:1px solid #4098D8;
}

/* If you’re using .filtersnone to hide individual selects */
.filtersnone {
  display: none;
}

/*Range Reset*/
#tickmarks {
  display: flex;font-size:0.85em;
  flex-direction: row;height: auto;
  overflow: hidden;
  justify-content: space-between;
}
input[type="range"] {
    cursor: pointer;height:1px;
}
input[type="range"], datalist{width:100%;}
@media only screen and (max-width :780px){
  #filters{flex-direction: column;align-items:stretch;}
  input[type="range"], datalist{max-width:none;}

}
/* Removes default focus */
input[type="range"]:focus::-webkit-slider-thumb {   
  outline: 1px solid #1e5c8a;
  outline-offset: 0.125rem; 
}

input[type="range"]:focus::-moz-range-thumb {
  outline: 1px solid #1e5c8a;
  outline-offset: 0.125rem; 
}



.one_fifth{width:100%;padding:0 1% 0}
.four_fifth{width:100%;padding:0 1% 0}
@media only screen and (max-width :999px){
	.one_fifth{width:100%;padding: 0}
	.four_fifth{width:100%;padding: 0}
}

#matchlist tfoot th{font-weight:400;font-size: 0.9em; font-style:italic;text-transform: none;text-align: left}
#matchlist td.tdmonthlydate div{padding-top:0;}

.filters-toggle:focus{color:#4098D8;border:1px dotted; border-left:none; }
.filters-toggle:hover{color:#4098D8;border:none; }
#matchlist tr.fixtures a:focus{color:#4098D8;}
#matchlist tr.fixtures a:focus span.btn_buy,#matchlist tr.fixtures a:focus span.btn_info{background-color:#1e5c8a;}
#matchcount{font-size:0.8em;}
#matchcountcontainer{display: inline-block;
    background: #fafafa;
    padding: 10px;
    border-left: 3px solid #ccc;}
  #SortFilterContainer{
    text-align:right;display: inline-block;
    float: right;padding:0px 0 10px 10px;
  }
  #toggleFiltersContainer{text-align: right;border-bottom: 1px solid #ccc;}
/* Simple CSS spinner */
  #fixtures-root {
    position: relative; /* anchor the overlay */
  }
  #fixtures-loading {
    /* ⏱️ */
    position: absolute;
    /* position: fixed; */
    /* ⏱️ */
    inset: 0;                    /* cover the whole root */
    background: rgba(255,255,255,.6);
    display: none;               /* default hidden */
    align-items: center;
    justify-content: center;
    z-index: 9999;                 /* above content, below header */
    pointer-events: none;        /* block clicks via root class instead */
  }
  
  #fixtures-loading .spinner {
    /* ⏱️ */
    position: absolute;
    left: calc(50% - 30px);
    /* ⏱️ */
    width: 60px;
    height: 60px;
    border: 10px solid #258;
    border-top-color: #49d;
    border-radius: 50%;
    animation: fixtures-spin 0.9s linear infinite;
  }
   /* ⏱️ */
  /* Variant: spinner near the top of the visible part */
  #fixtures-loading.loading-top .spinner {
    top: 10%; /* tweak as you like */
  }
  #fixtures-loading.loading-bottom .spinner {
    bottom: 10%; /* tweak as you like */
  }
   /* ⏱️ */
  
  /* Reduce or disable motion for a11y */
  @media (prefers-reduced-motion: reduce) {
    #fixtures-root .ft-spinner { animation: none; }
  }
  
  @keyframes fixtures-spin { to { transform: rotate(360deg); } }
  
  /* Visually hidden helper */
  .vh {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; border: 0;
  }
  
  /* While loading: dim + block interactions */
  #fixtures-root.is-loading {
    pointer-events: none;  /* block clicks inside root */
  }
  #fixtures-root.is-loading #fixtures-loading {
    display: flex;
  }