@import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700&display=swap");

@font-face {
   font-family: "Kanit";
   src: url("../font/Kanit-Regular.ttf");
}

* {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   font-family: var(--font-fam);
   color: var(--white);
}

html {
   scroll-behavior: smooth;
}

body {
   font-family: inherit;
   background: var(--black-gra);
   /*color: var(--dark-grey);*/
   letter-spacing: -0.4px;
   min-height: 100vh;
   color: #fff;

   /* set relative for button scroll to top */
   /* don't remove its... */
   position: relative;
}

#wrap-main.container {
   max-width: 1280px;
   min-height: 100vh;
   border-left: 1px solid #525252;
   border-right: 1px solid #525252;
   padding: 0;
}

#wrap-main-ls.container {
   max-width: 1000px;
   min-height: 100vh;
   border-left: 1px solid #525252;
   border-right: 1px solid #525252;
   padding: 0;
}

#wrap-main-price.container {
   max-width: 1000px;
   min-height: 63vh;
   border-left: 1px solid #525252;
   border-right: 1px solid #525252;
   padding: 0;
}

#wrap-main-post.container {
   max-width: 1000px;
   min-height: 63vh;
   border-left: 1px solid #525252;
   border-right: 1px solid #525252;
   padding: 0;
}

.head-title {
   color: var(--title-head-color);
   text-align: center;
   padding-top: 1rem;
}

.wrap-section-content-home {
   width: inherit;
}

.wrap-head-section {

}

.wrap-block-img {
   display: block;
   width: 100%;
   height: inherit;
   text-align: center;
}

.wrap-block-img img {
   width: 100%;
   height: auto;
   padding: 9px;
}

#b-img-mb, #block-img-top-mb {
   display: none;
}

.nav-menu-option {
   width: 100%;
   display: block;
   margin-bottom: 25px;
   padding: 8px 18px;
   background: linear-gradient(180deg, rgb(51 91 32 / 59%) 0%, #3c3b2b8f 100%);
   box-shadow: inset 0px 0px 5px 1px #5b650f;
}

.nav-menu-option .nav-fill .nav-item {
   margin: 0 5px;
   /* max-width: 25%; */
   width: 22%;
}

.nav-menu-option .nav-link {
   background-color: transparent;
   transition: 0.3s all !important;
   -webkit-transition: 0.3s all;
}

.nav-menu-option .nav-pills .nav-link.active {
   color: #fff;
   background: radial-gradient(circle ,rgb(166 174 70 / 81%) 0%, rgb(139 197 55 / 82%) 100%);
}

.nav-menu-option .nav-pills .nav-link {
   --c: no-repeat linear-gradient(180deg ,#43881e 0%, #0c5328d1 100%);
   background:
           var(--c)  calc(-101% + var(--p,0%)) 100% / 50.18% var(--p,.08em),
           var(--c)  calc( 201% - var(--p,0%)) 0    / 50.18% var(--p,.08em);
   transition: .3s var(--t,0s), background-position .3s calc(.3s - var(--t,0s));
}

.nav-menu-option .nav-pills .nav-link:hover {
   color: #fff;
   --p: 102%;
   --t: 0.3s;
}

.header-title-section {
   position: relative;
   background: transparent;
   width: auto;
   /*max-width: 250px;*/
   padding: 2em;
   margin: 8px auto 0
   /*border: 3px solid rgba(0, 0, 0, 0.08);*/
}

.header-title-section h1 {
   position: relative;
   font-size:36px;
   font-weight:300;
   letter-spacing:1px;
   text-transform:uppercase;
   /*width: 100%;*/
   width: fit-content;
   text-align:center;
   margin:auto;
   white-space:normal;
   padding: 11px 0 13px;
}
.header-title-section h1:before {
   background-color: #fbc638;
   content: '';
   display: block;
   height: 3px;
   width: 75px;
   margin-bottom: 5px;
   animation: fadeInOutAnimation 0.5s;
   animation-timing-function: ease-in;
   box-shadow: 1px 1px 0 #006200;
   left: -18px;
   position: absolute;
   top: -3px;
}
.header-title-section h1:after {
   background-color: #fbc638;
   content: '';
   display: block;
   position: absolute;
   right: -18px;
   bottom: -8px;
   height: 3px;
   width: 75px;
   margin-bottom: 0.25em;
   animation: fadeInOutAnimation 0.5s;
   animation-timing-function: ease-in;
   box-shadow: 1px 1px 0 #006200;
}

@keyframes fadeInOutAnimation {
   0% {
      opacity: 0;
      transform: scale(0);
   }
   100% {
      opacity: 1;
      transform: scale(1);
   }
}

.wrap-body-section {

}

.wrap-footer-section {
   padding: 3%;
}

/* btn more*/

.wrapper-btn-more {
   display: flex;
   justify-content: center;
   margin: 18px 0;
}

.cta {
   display: flex;
   padding: 10px 18px;
   text-decoration: none;
   font-family: 'kanit';
   font-size: 18px;
   color: white;
   background: green;
   transition: 1s;
   box-shadow: 6px 6px 0 black;
   transform: skewX(-15deg);
}

.cta:focus {
   outline: none;
}

.cta:hover {
   transition: 0.5s;
   box-shadow: 6px 5px 2px #FBC638;
}

.cta span:nth-child(2) {
   transition: 0.5s;
   margin-right: 0px;
}

.cta:hover  span:nth-child(2) {
   transition: 0.5s;
   margin-right: 11px;
}

.cta span {
   transform: skewX(15deg)
}

.cta span:nth-child(2) {
   width: 20px;
   margin-left: 17px;
   position: relative;
   top: 12%;
}

/**************SVG****************/

.cta path.one {
   transition: 0.4s;
   transform: translateX(-60%);
}

.cta path.two {
   transition: 0.5s;
   transform: translateX(-30%);
}

.cta:hover path.three {
   animation: color_anim 1s infinite 0.2s;
}

.cta:hover path.one {
   transform: translateX(0%);
   animation: color_anim 1s infinite 0.6s;
}

.cta:hover path.two {
   transform: translateX(0%);
   animation: color_anim 1s infinite 0.4s;
}

/* SVG animations */

@keyframes color_anim {
   0% {
      fill: white;
   }
   50% {
      fill: #FBC638;
   }
   100% {
      fill: white;
   }
}

.cta svg {
   vertical-align: unset;
}

/*end btn more*/

/*.btn-view-more {*/
/*   width: 135px;*/
/*   height: 35px;*/
/*   padding: 5px !important;*/
/*   margin: auto;*/
/*   border: 1px solid #fff;*/
/*}*/

/* Duball List*/
.duball-league-container {
   display: block;
   margin: 5px 0;
   background-color: #525252;
}

.duball-league-name {
   display: block;
   padding: 5px 2%;
}

.duball-content-container {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: normal;
   align-items: baseline;
   align-content: normal;

   padding: 8px;
   margin: 4px;
   background-color: #202020;
   border-radius: 5px;
   border: 1px solid #433d15;
   font-size: 18px;
}

.home-duball-items {
   display: block;
   flex-grow: 1;
   flex-shrink: 1;
   flex-basis: auto;
   align-self: auto;
   order: 0;

   text-align: right;
   padding-right: 2%;
}

.time-duball-items {
   display: block;
   flex-grow: 0;
   flex-shrink: 1;
   flex-basis: auto;
   align-self: auto;
   order: 0;

   padding: 2px 5px;
   background-color: #ecd68d;
   color: #000;
   border-radius: 8px;
}

.away-duball-items {
   display: block;
   flex-grow: 1;
   flex-shrink: 1;
   flex-basis: auto;
   align-self: auto;
   order: 0;

   padding-left: 2%;
}

.play-duball-items {
   display: flex;
   flex-grow: 0;
   flex-shrink: 1;
   flex-basis: auto;
   align-self: center;
   order: 0;
   position: absolute;
   right: 13px;
}

.play-btn {
   width: 30px;
   height: 30px;
   background: radial-gradient( rgb(28 120 63) 60%, rgb(149 148 19) 62%);
   border-radius: 50%;
   position: relative;
   display: block;
   /*margin: 100px auto;*/
   box-shadow: 0px 0px 8px 1px rgb(255 234 0 / 56%);
}

.play-btn-wait-time {
   cursor: default;
   background: transparent;
   box-shadow: unset !important;
   border: 1px solid #525252;
}

.play-btn-wait-time::after {
   border-left-color: #313131 !important;
}
.play-btn-wait-time::before {
   content: unset !important;
}

/* triangle */
.play-btn::after {
   content: "";
   position: absolute;
   left: 50%;
   top: 50%;
   -webkit-transform: translateX(-40%) translateY(-50%);
   transform: translateX(-40%) translateY(-50%);
   transform-origin: center center;
   width: 0;
   height: 0;
   border-top: 5px solid transparent;
   border-bottom: 5px solid transparent;
   border-left: 8px solid #fff;
   z-index: 100;
   -webkit-transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
   transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

/* pulse wave */
.play-btn:before {
   content: "";
   position: absolute;
   width: 160%;
   height: 160%;
   -webkit-animation-delay: 0s;
   animation-delay: 0s;
   -webkit-animation: pulsate1 2s;
   animation: pulsate1 2s;
   -webkit-animation-direction: forwards;
   animation-direction: forwards;
   -webkit-animation-iteration-count: infinite;
   animation-iteration-count: infinite;
   -webkit-animation-timing-function: steps;
   animation-timing-function: steps;
   opacity: 1;
   border-radius: 50%;
   border: 5px solid rgb(210 215 9 / 75%);
   top: -30%;
   left: -30%;
   background: rgba(198, 16, 0, 0);
}

@-webkit-keyframes pulsate1 {
   0% {
      -webkit-transform: scale(0.6);
      transform: scale(0.6);
      opacity: 1;
      box-shadow: inset 0px 0px 25px 3px rgba(117, 118, 26, 0.75), 0px 0px 25px 10px rgba(175, 137, 45, 0.75);
   }
   100% {
      -webkit-transform: scale(1);
      transform: scale(1);
      opacity: 0;
      box-shadow: none;

   }
}

@keyframes pulsate1 {
   0% {
      -webkit-transform: scale(0.6);
      transform: scale(0.6);
      opacity: 1;
      box-shadow: inset 0px 0px 25px 3px rgba(255, 252, 56, 0.75), 0px 0px 25px 10px rgba(212, 164, 42, 0.75);
   }
   100% {
      -webkit-transform: scale(1, 1);
      transform: scale(1);
      opacity: 0;
      box-shadow: none;

   }
}

/* Zean */


/* Article Card Slider */
/*@import url("https://fonts.googleapis.com/css?family=Quicksand:400,500,700&subset=latin-ext");*/
.wrapper {
   position: relative;
   /*overflow-x: hidden !important;*/
   width: 100%;
   height: 100%;
   display: block;
   overflow: hidden;
}

.icon {
   display: inline-block;
   width: 1em;
   height: 1em;
   stroke-width: 0;
   stroke: currentColor;
   fill: currentColor;
}

.background {
   position: absolute;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
}
.background:after {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-image: linear-gradient(180deg, rgb(51 91 32 / 59%) 0%, #3c3b2b8f 100%);
   opacity: 1;
   filter: brightness(1.3);
}
.background img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   pointer-events: none;
   user-select: none;
}

.item-bg {
   width: 300px;
   height: 500px;
   position: absolute;
   top: 30px;
   background: #202020;
   border-radius: 10px;
   box-shadow: 0 6px 26px 6px rgba(0, 0, 0, 0.25);
   /*opacity: 0;*/
   transition: all 0.3s;
   left: -30px;
   /*padding: 40px;*/
}
.item-bg.active {
   left: 0;
   top: 0;
   opacity: 1;
}

.news-slider {
   position: relative;
   z-index: 2;
   max-width: 1300px;
   margin-left: auto;
   margin-right: auto;
   margin-top: 60px;
}
@media screen and (max-width: 1300px) {
   .news-slider {
      max-width: 1000px;
   }
}
@media screen and (max-width: 576px) {
   .news-slider {
      margin-top: 45px;
   }
}
.news-slider__wrp {
   display: flex;
   align-items: flex-start;
   position: relative;
   z-index: 2;
}
.news-slider__item {
   width: 400px;
   flex-shrink: 0;
}
@media screen and (max-width: 992px) {
   .news-slider__item {
      width: 340px;
   }
}
.news-slider__item.swiper-slide {
   opacity: 0;
   pointer-events: none;
   transition: all 0.3s;
}
.news-slider__item.swiper-slide-active, .news-slider__item.swiper-slide-prev, .news-slider__item.swiper-slide-next {
   opacity: 1;
   pointer-events: auto;
}
.news-slider__ctr {
   position: relative;
   z-index: 12;
   height: 53px;
}
.news-slider__arrow {
   background: linear-gradient(180deg, rgb(231 229 43) 0%, #1eb616 100%);
   border: 2px solid #428514;
   display: inline-flex;
   width: 50px;
   height: 50px;
   justify-content: center;
   align-items: center;
   box-shadow: 0 6px 26px 6px rgba(0, 0, 0, 0.25);
   border-radius: 50%;
   position: absolute;
   top: 50%;
   z-index: 12;
   cursor: pointer;
   outline: none !important;
}
.news-slider__arrow:focus {
   outline: none !important;
}
.news-slider__arrow .icon-font {
   display: inline-flex;
}
.news-slider__arrow.news-slider-prev {
   left: 15px;
   transform: translateY(-50%);
   top: 20%;
}
.news-slider__arrow.news-slider-next {
   right: 15px;
   transform: translateY(-50%);
   top: 20%;
}
.news-slider__pagination {
   text-align: center;
   margin-top: 50px;
}
.news-slider__pagination .swiper-pagination-bullet {
   width: 10px;
   height: 10px;
   display: inline-block;
   background: #f6e00a;
   opacity: 1;
   margin: 0 5px;
   border-radius: 20px;
   transition: opacity 0.2s, background-color 0.5s, width 0.5s;
   transition-delay: 0.5s, 0.5s, 0s;
   box-shadow: 0px 1px 1px 1px #2b2b2b;
}
.news-slider__pagination .swiper-pagination-bullet-active {
   opacity: 1;
   background: #43cf14d6;
   width: 100px;
   transition-delay: 0s;
   box-shadow: 0px 1px 1px 1px #2b2b2b;
}
@media screen and (max-width: 576px) {
   .news-slider__pagination .swiper-pagination-bullet-active {
      width: 36px;
   }
}
.news__item {
   padding: 40px;
   margin: 10px;
   color: #fff;
   border-radius: 10px;
   display: block;
   transition: all 0.3s;
}

.news__item.bg-article {
   /*position: absolute; */
   top: 30px;
   background: #070a03;
   border-radius: 10px;
   box-shadow: 0 6px 26px 6px rgb(192 180 32 / 34%);
   opacity: 0.9;
   transition: all 0.3s;
   left: -30px;
   filter: brightness(1.1);
   border: 2px solid rgb(130 192 32 / 44%)
}

.active-bg-article, .bg-article:hover {
   opacity: 1 !important;
}

@media screen and (min-width: 800px) {
   .news__item:hover {
      color: #070a03;
      transition-delay: 0.1s;
   }
   .news__item:hover .news-date, .news__item:hover .news__title, .news__item:hover .news__txt {
      opacity: 1;
      transition-delay: 0.1s;
   }
   .news__item:hover .news__img {
      box-shadow: none;
   }
}
.news__item.active {
   color: #222222;
}
.news__item.active .news-date, .news__item.active .news__title, .news__item.active .news__txt {
   opacity: 1;
}
.news__item.active .news__img {
   box-shadow: none;
}
@media screen and (max-width: 992px) {
   .news__item {
      padding: 30px;
   }
}
@media screen and (max-width: 576px) {
   .news__item {
      padding: 20px;
   }
}
.news-date {
   padding-bottom: 20px;
   margin-bottom: 20px;
   border-bottom: 2px solid;
   display: inline-block;
   opacity: 0.7;
   transition: opacity 0.3s;
}
@media screen and (max-width: 576px) {
   .news-date {
      margin-bottom: 10px;
      display: inline-flex;
      align-items: center;
      padding-bottom: 0;
   }
}
.news-date__title {
   display: block;
   font-size: 32px;
   margin-bottom: 10px;
   font-weight: 500;
}
@media screen and (max-width: 576px) {
   .news-date__title {
      margin-right: 10px;
   }
}
.news-date__txt {
   font-size: 16px;
}
.news__title {
   font-size: 25px;
   font-weight: 500;
   opacity: 0.7;
   margin-top: 10px;
   margin-bottom: 15px;
   transition: opacity 0.3s;
}
@media screen and (max-width: 576px) {
   .news__title {
      font-size: 22px;
      margin-bottom: 10px;
   }
}
.news__txt {
   margin: 10px 0;
   line-height: 1.6em;
   font-size: 15px;
   opacity: 0.7;
   transition: opacity 0.3s;
}
.news__img {
   border-radius: 10px;
   box-shadow: 0 6px 26px 6px rgba(0, 0, 0, 0.25);
   height: 200px;
   margin-top: 30px;
   width: 100%;
   transition: all 0.3s;
   transform-origin: 0% 0%;
}
@media screen and (max-width: 576px) {
   .news__img {
      height: 180px;
      margin-top: 20px;
   }
}
.news__img img {
   max-width: 100%;
   border-radius: 10px;
   height: 100%;
   width: 100%;
}

.icon-arrow-left use, .icon-arrow-right use {
   fill: #154630;
}

/* LiveScore List*/
.ls-league-container {
   display: flex;
   flex-direction: row;
   /*margin: 5px 8px;*/
   padding: 4px 18px 4px 11px;
   /*background-color: #3e6c0f;*/
   background-color: #385403;
   align-items: center;
   max-height: 45px;
   height: 45px;
}

.wrap-l-logo {
   align-items: center;
   display: flex;
   height: 100%;
   min-width: 20px;
   width: 20px;
}

.ls-l-logo {
   min-height: 11px;
   width: 100%;
   height: auto;
}

.wrap-l-detail {
   display: flex;
   flex-direction: column;
   margin: 0 11px;
}

.ls-league-name {
   display: flex;
   flex-grow: 1;
   flex-shrink: 1;
   align-items: center;
   font-size: 16px;
}

.ls-league-detail {
   display: flex;
   flex-grow: 1;
   flex-shrink: 1;
   align-items: center;
   font-size: 13px;
}

.wrap-link {
   display: flex;
   flex-grow: 1;
   flex-shrink: 1;
   justify-content: end;
   font-size: 18px;
}

.ls-content-container {
   display: flex;
   flex-direction: row;
   /*flex-wrap: wrap;*/
   flex-wrap: inherit;
   justify-content: center;
   /*align-items: baseline;*/
   align-content: center;

   padding: 8px;
   margin: 4px;
   background-color: #202020;
   border-radius: 5px;
   border: 1px solid #433d15;
   font-size: 18px;
   position: relative;
}

.home-ls-items {
   display: flex;
   flex-grow: 1;
   flex-shrink: 1;
   flex-basis: auto;
   align-self: end;
   order: 0;
   text-align: right;
   padding-right: 2%;
   width: 38%;
   justify-content: end;
}

.home-ls-image, .away-ls-image {
   display: flex;
   flex: 0;
   flex-direction: row;
}

.home-ls-image {
   display: flex;
   justify-content: end;
   order: 1;
}

.home-ls-image img, .away-ls-image img {
   width: 24px;
   height: auto;
   margin: auto 4px;
   max-height: 27px;
}

.home-ls-name {
   display: flex;
   justify-content: end;
   padding: 0 11px;
}

.detail-ls-items {
   display: flex;
   flex-direction: row;
   align-items: center;
   flex-grow: 1;
   justify-content: center;
   font-size: 16px;
   width: 16%;
}

.status-ls-items, .score-ls-items {
   display: flex;
   flex-grow: 0;
   flex-shrink: 1;
   flex-basis: auto;
   align-self: auto;
   order: 0;
   min-width: 33px;
   justify-content: center;
}

.status-ls-items {
   min-width: 50%;
   font-size: 15px;
}

.status-ls-1 {
   background: #4a4c21;
   border-radius: 4px;
   margin-right: 4px;
   height: 100%;
   align-items: center;
}

.status-ls-2 {
   background: #4a4c21;
   border-radius: 4px;
   margin-right: 4px;
   height: 100%;
   align-items: center;
}

.wait-time-style {
   padding: 2px 5px;
   background-color: #ecd68d;
   color: #000;
   border-radius: 8px;
}

.score-ls-items {
   background-color: #54700c;
   border-radius: 4px;
   padding: 0 11px;
   margin-left: 4px;
   min-width: 50%;
   height: 100%;
   align-items: center;
}

.score-ls-items span {
   color: inherit;
}

.home-score-ls {
   margin: 0 3px;
   color: inherit;
}

.away-score-ls {
   margin: 0 3px;
   color: inherit;
}

.away-ls-items {
   display: flex;
   flex-grow: 1;
   flex-shrink: 1;
   flex-basis: auto;
   align-self: center;
   order: 0;
   padding-left: 2%;
   width: 38%;
}

.away-ls-image {
   display: flex;
   flex-direction: row;

}

.away-ls-name {
   display: flex;
   justify-content: start;
   padding: 0 11px;
}

.play-ls-items {
   display: block;
   flex-grow: 0;
   flex-shrink: 1;
   flex-basis: auto;
   align-self: auto;
   order: 0;
}



.detail-status-live .status-ls-items {
   color: #f3f906;
}

.detail-status-live:before {
   /*content: "";*/
   /*border-radius: 0 7.5px 7.5px 0;*/
   /*display: block;*/
   /*height: calc(100% - 18px);*/
   /*left: 0;*/
   /*position: absolute;*/
   /*top: 9px;*/
   /*width: 4.4px;*/
   /*background: #fbc638;*/

   content: attr(data-before);
   border-radius: 3px;
   display: flex;
   left: 0;
   position: absolute;
   top: 3px;
   width: 43px;
   height: 37px;
   padding: 0 0px;
   background-color: #c01f1f;
   text-align: center;
   margin-left: 9px;
   color: #f8f8f8;
   line-height: 1.4;
   letter-spacing: 0.3px;
   font-weight: bold;
   font-size: 13px;
   word-wrap: break-word;
}

.time-plus {
   display: none;
}

.status-only-tb-pc {
   color: #f3f906;
}

.finished-status {
   color: #fff !important;
}
/* end live score*/

/* slide analysis */
/*#news-slider{*/
/*   margin-top: 0px;*/
/*}*/
.post-slide{
   background: #869d1494;
   margin: 20px 15px 20px;
   border-radius: 15px;
   padding-top: 1px;
   box-shadow: 7px 11px 18px -8px #cdeb8aa6;
   /*max-width: 333px;*/
}
.post-slide .post-img{
   position: relative;
   overflow: hidden;
   border-radius: 10px;
   margin: -12px 15px 8px 15px;
   margin-left: -10px;
   /*border: 1px solid #c7b408ab;*/
   box-shadow: 1px 0px 3px 2px #c7b408ab;
}
.post-slide .post-img img{
   width: 100%;
   /* height: 225px; */
   height: auto;
   /* max-height: 225px; */
   transform: scale(1,1);
   transition: transform 0.2s linear;
   aspect-ratio: 16 / 9;
}
/*.post-slide:hover .post-img img{*/
.post-img:hover img{
   transform: scale(1.1,1.1);
}
.post-slide .over-layer{
   width:100%;
   height:100%;
   position: absolute;
   top:0;
   left:0;
   opacity:0;
   background: linear-gradient(176deg, rgb(93 23 14 / 57%) 0%, rgb(24 13 6 / 76%) 100%);
   transition:all 0.50s linear;
}
/*.post-slide:hover .over-layer{*/
.over-layer:hover {
   opacity:1;
   text-decoration:none;
}
.post-slide .over-layer i{
   position: relative;
   top:45%;
   text-align:center;
   display: block;
   color:#fff;
   font-size:25px;
}
.post-slide .post-content{
   background: #090f06fa;
   padding: 18px 23px 25px;
   border-radius: 15px;
   height: 243px;
   max-height: 243px;
   position: relative;
}
.post-slide .post-title a{
   font-size: 17px;
   font-weight:bold;
   color: #ceff01;
   display: inline-block;
   text-transform:uppercase;
   transition: all 0.3s ease 0s;
}

.post-slide .post-title a:hover{
   text-decoration: none;
   color: #adff2f;
}

.post-slide .post-description{
   line-height:24px;
   color:#f2f2f2;
   margin-bottom:25px;
   font-size: 15.2px;

   display: block;
   overflow-y: auto;
   word-break: break-word;
   height: 108px;
   padding: 5px;
}

.post-foot {
   display: block;
   position: absolute;
   bottom: 0;
   left: 0;
   width: 88%;
   margin: 5% 6%;
}

.post-slide .post-date{
   color: #fff304;
   font-size: 14px;
   display: inline-block;
   margin-top: 6px;
}
.post-slide .post-date i{
   font-size:20px;
   margin-right:8px;
   color: #CFDACE;
}
.post-slide .read-more{
   padding: 7px 20px;
   float: right;
   font-size: 14px;
   background: linear-gradient(180deg, rgb(74 227 23 / 76%) 0%, rgb(236 218 23 / 60%) 100%);
   color: #f9f9f6;
   box-shadow: 0px 10px 20px -10px #231e18;
   border-radius: 25px;
   text-transform: uppercase;
}
.post-slide .read-more:hover{
   background: #eadc0d;
   text-decoration: none;
   color: #070404;
}
/*.owl-controls .owl-buttons{*/
/*   text-align:center;*/
/*   margin-top:20px;*/
/*}*/
/*.owl-controls .owl-buttons .owl-prev{*/
/*   background: #fff;*/
/*   position: absolute;*/
/*   top:-13%;*/
/*   left:15px;*/
/*   padding: 0 18px 0 15px;*/
/*   border-radius: 50px;*/
/*   box-shadow: 3px 14px 25px -10px #92b4d0;*/
/*   transition: background 0.5s ease 0s;*/
/*}*/
/*.owl-controls .owl-buttons .owl-next{*/
/*   background: #fff;*/
/*   position: absolute;*/
/*   top:-13%;*/
/*   right: 15px;*/
/*   padding: 0 15px 0 18px;*/
/*   border-radius: 50px;*/
/*   box-shadow: -3px 14px 25px -10px #92b4d0;*/
/*   transition: background 0.5s ease 0s;*/
/*}*/
/*.owl-controls .owl-buttons .owl-prev:after,*/
/*.owl-controls .owl-buttons .owl-next:after{*/
/*   content:"\f104";*/
/*   font-family: FontAwesome;*/
/*   color: #333;*/
/*   font-size:30px;*/
/*}*/
/*.owl-controls .owl-buttons .owl-next:after{*/
/*   content:"\f105";*/
/*}*/
@media only screen and (max-width:1280px) {
   .post-slide .post-content{
      padding: 18px 23px 25px;
   }
}

/*Price*/
.price-container {
   font-size: 16px;
}

.price-head-container {
   display: block;
   width: 100%;
   height: 100%;
}

.wrap-price-head {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: stretch;
   align-items: stretch;
   align-content: stretch;

   background-color: #0a0a0a;
   height: auto;
}

.status-price-head {
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   justify-content: center;
   align-items: center;
   align-content: stretch;
   border-top: 1px solid #282c03d4;
   border-bottom: 1px solid #282c03d4;
   min-width: 8%;
}

.team-price-head {
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   justify-content: center;
   align-items: center;
   align-content: stretch;
   min-width: 27%;
   border-top: 1px solid #282c03d4;
}

.team-home-head, .team-away-head {
   display: flex;
   flex-grow: 1;
   flex-shrink: 1;
   flex-basis: auto;
   align-self: center;
   justify-content: center;
   order: 0;
   align-items: center;
   width: 100%;
   padding: 0 8px;
   border-left: 1px solid #282c03d4;
   border-bottom: 1px solid #282c03d4;
}

.detail-price-head {
   display: flex;
   flex-direction: column;
   flex-grow: 2;
   order: 0;
   flex-wrap: wrap;
   height: inherit;
   border: 1px solid #282c03d4;
}

.full-detail-price-head {
   display: flex;
   flex-direction: column;
   width: 100%;
   border-bottom: 1px solid #282c03d4;
}

.fulltime-head {
   display: flex;
   justify-content: center;
   align-items: center;
   border-bottom: 1px solid #282c03d4;
   height: 50%;
}

.fulltime-detail-head {
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
   height: 50%;
}

.item-full-detail-head {
   display: flex;
   width: 100%;
   justify-content: center;
   align-items: center;
   border-right: 1px solid #282c03d4;
}

.half-detail-price-head {
   display: flex;
   flex-direction: column;
   width: 100%;
}

.halftime-head {
   display: flex;
   width: 100%;
   justify-content: center;
   align-items: center;
   border-bottom: 1px solid #282c03d4;
   height: 50%;
}

.halftime-detail-head {
   display: flex;
   flex-direction: row;
   width: 100%;
   justify-content: center;
   align-items: center;
   height: 50%;
}

.item-half-detail-head {
   display: flex;
   width: 100%;
   justify-content: center;
   align-items: center;
   border-right: 1px solid #282c03d4;
}

/*price league*/

.price-league-container {
   display: flex;
   flex-direction: row;
   /* margin: 5px 8px; */
   padding: 4px 18px 4px 11px;
   background-color: #3e6c0f;
   align-items: center;
}

.price-league-name {

}

.price-league-name i {
   padding-right: 8px;
   color: #f3ff00;
}

.price-detail-container {
   display: block;
   width: 100%;
   height: 100%;
}

.wrap-price-detail {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: center;
   align-items: stretch;
   align-content: stretch;

   background-color: #000000;
   min-height: 63px;
}

.wrap-price-detail:hover {
   background-color: #48423a;
}

.status-price-items {
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   justify-content: center;
   align-items: center;
   align-content: stretch;
   border-top: 1px solid #282c03d4;
   border-bottom: 1px solid #282c03d4;
   width: 8%;
}

.team-price-items {
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   justify-content: center;
   align-items: center;
   align-content: stretch;
   min-width: 27%;
   max-width: 27%;
   border: 1px solid #282c03d4;
}

.detail-price-items {
   display: flex;
   flex-direction: column;
   flex-grow: 2;
   order: 0;
   flex-wrap: wrap;
   height: 81px;
}

/* Price Detail All Item*/
.status-price-block {
   display: flex;
   /*flex-grow: 1;*/
   flex-shrink: 0;
   flex-basis: auto;
   align-self: center;
   align-items: center;
   justify-content: center;
   order: 0;
   padding: 0 8px;
   width: 100%;
   min-width: 53px;
}

.price-status {
}

.price-time {
}

.price-date {
}

.team-price-block {
   display: flex;
   flex-grow: 0.2;
   flex-shrink: 1;
   flex-basis: auto;
   align-self: start;
   order: 0;
   align-items: center;

   width: 100%;
   padding: 0 8px;
   /*border: 1px solid #2f2f2f;*/
}

.price-team-home {

}

.price-team-away {
}

.price-full-time {
   display: flex;
   flex-direction: row;
   height: 50%;
}

.price-half-time {
   display: flex;
   flex-direction: row;
   height: 50%;
}

.price-detail-block {
   display: flex;
   width: 100%;
   justify-content: center;
   align-items: center;
   border: 1px solid #282c03d4;
}

.col-price {
   background-color: #0d1704;
}

.col-home {
}

.col-away {
}

.col-goal {
   background-color: #0d1704;
}

.col-high {
}

.col-low {
}

.odd-row-price {
   background-color: #0b180a;
}

.wrap-price-detail.odd-row-price .col-price,
.wrap-price-detail.odd-row-price .col-goal {
   background-color: #10250e;
}

.wrap-price-detail:hover .col-price,
.wrap-price-detail:hover .col-goal {
   background-color: rgba(63, 59, 51, 0.95) !important;
}

.price-goal-color {
   color: #adff2f;
}

.minus-price, .price-team-tor {
   color: #ffca2c;
}

.time-racing {
   color: #fffb13;
}

/*country flag*/
.wrap-flag-country {
   padding: 2% 2% 8px 2%;
   background-color: #1e5206;
   box-shadow: 0px 1px 4px 0px #71bc0ec9;
}

.wrap-flag-country .item {
   background: transparent;
}

.wrap-flag-country .item span {
   display: block;
   color: #FFF;
   text-align: center;
   margin: 0;
   /*font-style: italic;*/
   /*font-weight: 300;*/
}

.carousel-country-flag {
   /*width: 150px !important;*/
   height: 45px;
}
/*end country flag*/

/*tded youtube*/
#lightbox-container {
   position: fixed;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 70%;
   height: auto;
   max-width: 800px;
   background-color: rgba(0, 0, 0, 0.8);
   display: none;
   z-index: 9999;
}

#lightbox-video {
   position: relative;
   width: 100%;
   padding-bottom: 56.25%;
}

#lightbox-video iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}

#lightbox-close-btn {
   position: absolute;
   top: 10px;
   right: 10px;
   font-size: 20px;
   color: #fff;
   background-color: transparent;
   border: none;
   cursor: pointer;
   z-index: 1;
}

.saturn-feed--wrapper {
   display: flex;
   flex-wrap: wrap;
   gap: 2em;
}
.saturn-feed--wrapper > a {
   width: 31.33%;
}
.saturn-feed--wrapper > a img {
   max-width: 100%;
   height: 100%;
   object-fit: cover;
}
/*end tded youtube*/


/*footer*/
.footer ul{
   list-style: none;
   padding: 0;
}
.footer{
   background-color: #040d02;
   padding: 70px 0;
}
.footer-col{
   width: 25%;
   padding: 0 15px;
}
.footer-col h4{
   font-size: 18px;
   color: #ffffff;
   text-transform: capitalize;
   margin-bottom: 35px;
   font-weight: 500;
   position: relative;
}
.footer-col h4::before{
   content: '';
   position: absolute;
   left:0;
   bottom: -10px;
   background-color: #dcde0f;
   height: 2px;
   box-sizing: border-box;
   width: 50px;
}
.footer-col ul li:not(:last-child){
   margin-bottom: 10px;
}
.footer-col ul li a{
   font-size: 16px;
   text-transform: capitalize;
   /*color: #ffffff;*/
   text-decoration: none;
   font-weight: 300;
   color: #bbbbbb;
   display: block;
   transition: all 0.3s ease;
}
.footer-col ul li a:hover{
   color: #ffffff;
   padding-left: 8px;
}
.footer-col .social-links a{
   display: inline-block;
   height: 40px;
   width: 40px;
   background-color: rgba(255,255,255,0.2);
   margin:0 10px 10px 0;
   text-align: center;
   line-height: 40px;
   border-radius: 50%;
   color: #ffffff;
   transition: all 0.5s ease;
}
.footer-col .social-links a:hover {
   background-color: #bedd1e;
}

.footer-col .social-links a:hover i {
   color: #24262b !important;
}

/*responsive*/
@media(max-width: 767px){
   .footer-col{
      width: 50%;
      margin-bottom: 30px;
   }
}
@media(max-width: 574px){
   .footer-col{
      width: 100%;
   }
}

.link-footer-bl {
   color: #ffca2c;
   text-decoration: underline;
   font-weight: bold;
}

.link-footer-bl:hover {
   color: #00b400;
}

/*footer end*/

/*owl carousel override default theme*/
.owl-theme .owl-dots .owl-dot span {
   background: #787a6d;
   border: 1px solid #000;
   box-shadow: 1px 1px 1px 0px #171212;
}

.owl-theme .owl-dots .owl-dot.active span {
   background: #f6e00a !important;
   border: 1px solid #000;
   box-shadow: 1px 1px 1px 0px #171212;
}

/* Pagination Override */
.pagination {
   margin-bottom: 0;
}

.page-link {
   color: #fff;
   background-color: #609400;
   border-color: #525252;
   min-width: 35px;
   text-align: center;
}

.page-item.active .page-link, .page-link:hover {
   color: #000 !important;
   background-color: #FBC638 !important;
   border-color: #525252 !important;
}

.page-item:first-child .page-link, .page-item:last-child .page-link {
   max-width: 108px;
   width: max-content;
   text-align: center;
   background-color: #817f02;
   color: #fff;
   border-color: #525252;
}

.page-item:first-child .page-link:hover, .page-item:last-child .page-link:hover {
   color: #f0f0f0;
   filter: brightness(1.1);
}

/*menu offcanvas*/
.offcanvas-nav .form-inline { display: none}
.is-hidden {  visibility: hidden;}

.c-offcanvas {
   background: rgb(10 21 4);
   box-shadow: 0 0 8px 1px #494e21;
}

.c-offcanvas--right {
   width: 306px;
}

.c-offcanvas-bg {
   z-index: 10000;
}
.c-offcanvas--overlay {
   z-index: 10001;
}
/*clear outline native browser (ios)*/
/*.c-offcanvas-nav a.link-b:focus-visible, .c-offcanvas-nav img:focus-visible {*/
/*   outline: unset !important;*/
/*   outline-offset: unset !important;*/
/*}*/

.c-offcanvas .link-b:-webkit-any-link:focus-visible {
   outline: unset;
}

.offcanvas-nav a.nav-link:first-child {
   border-top: 1px solid #132613;
}
.offcanvas-nav a.nav-link {
   display: block;
   margin: 0 auto;
   width: inherit;
   height: auto;
   padding: 11px 0 11px 35px;
   border-bottom: 1px solid #132613;
}

.offcanvas-nav a.nav-link:hover {
   background-color: #867a14;
}

.offcanvas-nav a.nav-link span {
   padding-left: 8px;
}

.wrap-banner-menu-mobile {
   display: block;
   width: 100%;
   height: initial;
}

.b-img-mb, .b-row-img {
   width: 100%;
   height: auto;
   outline: unset !important;
}

.b-row-img {
   margin: 8px 0;
}

/* scroll to top*/
.scrolltop-wrap {
   box-sizing: border-box;
   position: absolute;
   top: 18rem;
   right: 1.53rem;
   bottom: 0;
   pointer-events: none;
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
   z-index: 10000;
}
.scrolltop-wrap #scrolltop-bg {
   fill: #4d6e28;
}
.scrolltop-wrap #scrolltop-arrow {
   fill: #ebed0c;
}
.scrolltop-wrap a:hover #scrolltop-bg {
   fill: #7fa934;
}
.scrolltop-wrap a:hover #scrolltop-arrow {
   fill: white;
}
@supports (-moz-appearance: meterbar) {
   .scrolltop-wrap {
      clip: rect(0, 3rem, auto, 0);
   }
}
.scrolltop-wrap a {
   position: fixed;
   position: sticky;
   top: -11rem;
   width: 3rem;
   height: 3rem;
   margin-bottom: -5rem;
   transform: translateY(100vh);
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
   display: inline-block;
   text-decoration: none;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   pointer-events: all;
   outline: none;
   overflow: hidden;
}
.scrolltop-wrap a svg {
   display: block;
   border-radius: 50%;
   width: 100%;
   height: 100%;
   opacity: 0.81;
   transition: .3s ease-in-out;
}
.scrolltop-wrap a svg:hover {
   opacity: 1;
}
.scrolltop-wrap a svg path {
   transition: all 0.1s;
}
.scrolltop-wrap a #scrolltop-arrow {
   transform: scale(0.66);
   transform-origin: center;
}

/* word press additional option css*/
.aligncenter {
   text-align: center;
}

/* dialog box ads */
.dialog-box {
   position: fixed;
   z-index: 10004;
   pointer-events: all;
   background-color: rgba(0,0,0,.8);
   top: 0;
   display: block;
   width: 100%;
   height: 100vh;
   margin: auto;
}

.dialog-content {
   display: flex;
   justify-content: center;
   /*align-items: center;*/
   width: 100%;
   height: 100%;
}

.dialog-btn-close {
   font-size: 17px;
   text-align: center;
   display: block;
   margin-bottom: 17px;
}

.dialog-btn-close:hover {
   color: #FBC638;
}

.wrap-img-content {
   /*width: 72%; !*or whatever you choose*!*/
   margin: 11% auto;
   padding: 18px;
}

.link-content-img {
   position: relative;
   z-index: 10005;
}

.wrap-img-content img {
   display: block;
   width: 100%;
   border-radius: 18px;
   max-width: 441px;
   height: auto; /* maintain aspect ratio*/
   margin: auto;
   box-shadow: 0 0 11px 2px #96d441;
   transition: all .3s ease-in-out;
}

/* tded-youtube */
.wrap-profile-channel {
   display: flex;
   width: 100%;
   margin: 2rem 0px;
   flex-direction: column;
   align-items: center;
}

.title-ch {
   font-size: 22px;
   margin-top: 1rem;
}

.img-channel {
   width: 128px;
   height: 128px;
   border-radius: 50%;
   box-shadow: 0px 0px 11px 2px #447537;
   transition: scale 1s ease-in-out;
}

.img-channel:hover {
   cursor: zoom-in;
   scale: 1.2;
}

.wrap-subscribe-btn {
   display: flex;
   padding-top: 2px;
}

.wrap-youtube-ch-item {
   display: flex;
   flex-direction: column;
   justify-content: center;
   padding: 2rem;
}

.wrap-youtube-ch-item p {
   padding: 0 9px;
}

.youtube-poster {
   display: block;
   flex: 0 1;
   position: relative;
}

.youtube-poster a::before {
   content: "";
   background-image: url("../images/icon-play-youtube.png");
   background-position: center;
   background-size: 17%;
   display: flex;
   width: 100%;
   position: absolute;
   background-repeat: no-repeat;
   top: 0;
   z-index: 2;
   cursor: pointer;
   padding: 28%;
   opacity: 0.72;
   transition: .27s ease-in-out;
}

.youtube-poster a:hover:before {
   opacity: 1;
   transform: scale(1.1);
}

.youtube-title {
   display: block;
}

.youtube-title h2 {
   text-align: center;
   font-size: 21px;
}

.youtube-des span {
   display: block;
   font-weight: lighter;
   font-size: 17px;
}

.vdo-cover{
   width: 100%;
   height: auto;
   margin: 1rem auto;
   display: inline-block;
   position: relative;
   transition: .3s ease-in-out;
}

.vdo-poster{
   position: relative;
   z-index: 1;
   width: 100%;
   height: auto;
}

.vdo-container{
   position:absolute;
   top:0;
   left:0;
   width:100%;
   height:100%;
   display: none;
   z-index: 3;
}

/*standing*/
.wrap-tb-price-detail {
   margin: 1rem 0;
}

.table-standing {
   /*background-color: #243620;*/
}

.table-standing-detail {
   border-top: 1px solid #2b2b2b;
   border-bottom: 1px solid #2b2b2b;
}

#nav-container-std .nav-tabs {
   border-bottom: unset;
}

.table-standing .nav-item {
   width: calc(100% / 3);
   text-align: center;
}
.table-standing .nav-tabs {
   border-bottom: unset;
}
.table-standing .nav-tabs li:nth-child(1) a {
   border-left: unset !important;
}
.table-standing .nav-tabs li:nth-child(2) a {
   border-left: unset !important;
   border-right: unset !important;
}
.table-standing .nav-tabs li:nth-child(3) > a {
   border-right: unset !important;
}
.table-standing .nav-link {
   border: 1px solid #000 !important;
   background-color: #2b2b2b !important;
   color: white;
   font-size: 21px;
   text-decoration: none;
   border-radius: unset !important;
}

.table-standing .nav-link:hover {
   background-color: #4e555b !important;
   color: white !important;
}

.table-standing .nav-item a.active {
   background-color: #e4e817 !important;
   color: black !important;
}

.head-standing, .row-standing {
   display: inline-flex;
}

.rank span:nth-child(2) {
   display: none;
}

.rank, .logo-team-name-std, .detail-place-type {
   background-color: #243620;
}

.group-row {
   height: 45px;
   font-size: 21px;
   text-align: center;
   display: flex;
   margin-top: 3rem;
   align-items: center;
   justify-content: center;
   border-bottom: 1px solid #000;
   border-top: 1px solid #000;
   background-color: #15741d;
}

.gr-1 {
   margin-top: 0;
}

.head-standing {
   position: -webkit-sticky;
   position: sticky;
   top: 90px;
   z-index: 2;
   border-bottom: 1px solid black;
}

.head-standing div {
   /*width: 100%;*/
   display: inline-flex;
   height: 45px;
   font-size: 21px;
   align-items: center;
   justify-content: center;
}

.head-standing > div:not(:nth-child(3)) {
   background-color: #404b3b;
   border-right: 1px solid black;
   color: white;
}

.wrap-head-score-title > div {
   background-color: #404b3b;
   color: #fff;
   width: calc(100% / 8);
}

.wrap-head-score-title > div:not(:nth-child(1)) {
   border-left: 1px solid black;
}

.logo-st {
   width: 24px;
   height: auto;
}

.logo-team-name-std {
   padding-left: 1rem;
}

.row-standing div {
   /*width: 100%;*/
   display: inline-flex;
   height: 45px;
   align-items: center;
   font-size: 18px;
}

.row-standing > div:not(:nth-child(2)) {
   justify-content: center;
}

.row-standing > div {
   color: white;
   border-bottom: 1px solid black;
}

.row-standing > div:not(:nth-child(3)) {
   border-right: 1px solid black;
}

.wrap-score-detail > div:not(:nth-child(1)) {
   border-left: 1px solid black;
}

.wrap-score-detail > div {
   justify-content: center;
   width: calc(100% / 8);
}

.row-standing .even {
   background-color: #1e5206;
   color: #000;
}
.row-standing .odd {
   background-color: #1a2f16;
   color: #000;
}

.team-detail {
   padding-left: 8px;
}

.foot-standing {
   width: 100%;
   background-color: #cbc908;
   color: #00001F;
   height: 35px;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 18px;
}

.detail-place-type {
   padding: 1.8rem;
   color: white;
   font-size: 18px;
   margin: 2rem 0 1rem;
   border-radius: 0.72em;
}

.head-pt {
   font-size: 21px;
}

.color-detail-pt {
   padding: 11px;
   margin: 10px 8px;
   display: inline-flex;
   color: white;
}

.wrap-detail-pt {
   display: inline-flex;
   align-items: center;
}

.t_red {
   background-color: #555d07;
}

.t_saddlebrown {
   background-color: #745805;
}

.t_maroon {
   background-color: #5d4e21;
}

.t_violetred {
   background-color: #044e2f;
}

.t_chocolate {
   background-color: #454e04;
}

.t_indianred {
   background-color: #4e3704;
}

.t_more_color_1 {
   background-color: #164e48;
}

.t_more_color_2 {
   background-color: #4e1835;
}

.btn-league {
   background-color: transparent;
   color: white;
   border: 2px solid #c55409;
   font-size: 21px;
   padding: 6px 26px;
}

.btn-league:focus {
   box-shadow: unset;
}

.modal-footer .btn-league {
   border: unset;
   width: 100%;
   height: 100%;
   border-radius: unset;
}

.btn-league:hover {
   background-color: #ff6600;
   color: #fff;
}

.img-league-title-standing {
   width: auto;
   height: 108px;
   display: block;
   margin: 0 auto 2rem;
   border-radius: 18px;
}

.img-league-choose-standing {
   width: auto;
   height: 72px;
   display: block;
   text-align: center;
   margin: 9px auto;
   max-width: 189px;
   padding: 2px;
}

.wrap-league-choose {
   padding: 18px 8px;
   height: 100%;
   max-height: 207px;
   margin: 2px;
   border-radius: 18px;
   border: 2px solid transparent;
   transition: .36s ease-in-out all;
}

.wrap-league-choose:hover {
   background-color: #393930;
   border-color: #ffca2c;
}

.wrap-league-choose:hover span {
   color: #ffca2c;
}

.name-league-choose-standing {
   display: block;
   width: 100%;
   text-align: center;
}

.no-data {
   display: block;
   color: #ff0000;
   width: 100%;
   text-align: center;
   font-size: 16px;
}

.league-standing-container {
   padding: 1rem 2rem;
   background-color: #26451f;
   margin: 1rem auto 3rem;
   border-radius: 18px;
   border: 2px solid #ffca2c;
   width: 100%;
   max-width: 1200px;
}

.wrap-filter-league {
   display: flex;
   justify-content: center;
   margin-bottom: 2em;
}

.wrap-filter-league input#search-league-standing {
   background-color: #1b1d1b;
   border-radius: 6px;
   padding: 0.7rem;
   padding-left: 2.4rem;
   font-size: 16px;
   width: 100%;
   border: 1px solid #ffca2c;
   box-shadow: 1px 1px 1px #5eae17;
   max-width: 300px;
   outline: unset;
}

.filter-league {
   position: relative;
   margin: 0 1em;
   width: 300px;
}

.filter-league .bx-filter {
   position: absolute;
   left: 10px;
   top: 50%;
   font-size: 1.3rem;
   transform: translateY(-50%);
   opacity: 0.6;
}

.league-obj {
   transition: .3s div ease-out;
}

.no-result-filter {
   color: #ff0000;
   font-size: 16px;
   text-align: center;
}

/* dd-slick override */
.dd-container {
   width: 300px !important;
   margin: 0 1em;
}

.dd-options {
   width: 300px !important;
   height: 360px;
   border: solid 1px #242723 !important;
   box-shadow: 0px 1px 5px #4d5b25 !important;
}
.dd-options li {
   background: linear-gradient(180deg, rgb(20 21 5) 19%, rgb(7 26 6) 50%, rgb(6 22 14 / 98%) 79%) !important;
}

.dd-option {
   border-bottom: solid 1px #3c3838 !important;
   height: 45px;
}

.dd-option:hover {
   background-color: #168925 !important;
}

.dd-select {
   /*height: 53px;*/
   width: 300px !important;
   border-radius: 7px !important;
   border: unset !important;
}

.dd-selected {
   background: linear-gradient(180deg, rgb(20 21 5) 19%, rgb(7 26 6) 50%, rgb(6 22 14 / 98%) 79%) !important;
   border: 1px solid #ffca2c !important;
   box-shadow: 1px 1px 1px #5eae17;
   border-radius: 7px !important;
   height: 48px;
}

.dd-pointer-down {
   border-top: solid 5px #f8f1f1 !important;
}

.dd-pointer-down.dd-pointer-up {
   border-bottom: solid 5px #f8f1f1 !important;
}

.dd-option-selected {
   background-color: #168925 !important;
}

.dd-option-text, .dd-selected-text {
   line-height: unset !important;
}

.dd-options {

}

.dd-option-image, .dd-selected-image {
   max-width: 36px !important;
   height: 26px;
   min-width: 45px;
}

/* highlight */
.wrap-vdo-hl {
   display: flex;
   justify-content: center;
   margin: 1rem;
   position: relative;
}

@media (hover:hover) {
   .wrap-vdo-hl:hover .content-hl {
      transform: scale(1.05);
   }
}

.wrap-player-hl {
   width: 100%;
   height: auto;
   aspect-ratio: 16/9;
   border-radius: 8px;
}

.player-hl {
   width: 100%;
   height: auto;
   aspect-ratio: 16/9;
   border-radius: 8px;
   border: 2px solid #b8b952;
   box-shadow: 0 0 7px 1px #55ce25;
}

.content-hl {
   position: absolute;
   width: 100%;
   height: 100%;
   left: 0;
   top: 0;
   background: rgb(36, 36, 36);
   padding: 1rem;
   display: flex;
   flex-direction: column;
   justify-content: center;
   border-radius: 8px;
   cursor: pointer;
   transition: .3s all ease-in-out;
   border: 2px solid #b8b952;
   box-shadow: 0 0 7px 1px #55ce25;
}

.head-hl {
   text-align: center;
}

.head-hl h2 {
   font-size: 24px;
}

.body-hl {
   display: flex;
   justify-content: center;
   font-size: 16px;
   padding: 0.53em;
}

.wrap-team-hl {
   display: flex;
   flex-direction: column;
   align-items: center;
   width: 38%;
}

.vs-score-hl {
   display: flex;
   flex-direction: column;
   justify-content: center;
   width: 24%;
   text-align: center;
   font-size: 27px;
}

.vs-hl {

}

.score-hl {
   margin: 8px 0;
   letter-spacing: 2px;
   font-size: 21px;
}

.img-logo-hl {
   width: auto;
   height: 53px;
   margin: 11px auto 0.35em;
}

.team-name-hl {
   text-align: center;
}

.foot-hl {
   text-align: center;
   font-size: 16px;
}

.status-alert-hl {
   color: #ffca2c;
   font-size: 16px !important;
   letter-spacing: 0px !important;
}

/* neon effect */
.neon {
   text-align: center;
   color: #000;
   font-size: 26px;
   font-weight: bold;
   position: relative;
   letter-spacing: 1px;
   text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #36c231,
   0 0 35px #36c231, 0 0 40px #36c231, 0 0 50px #36c231;
   /*animation: neon 1s ease-in-out infinite alternate;*/
}

@keyframes neon {
   from {
      text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #36c231,
      0 0 35px #36c231, 0 0 40px #36c231, 0 0 50px #36c231;
   }
   to {
      text-shadow: 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #36c231, 0 0 35px #36c231,
      0 0 40px #36c231, 0 0 50px #36c231, 0 0 75px #36c231;
   }
}

.head-vision {
   flex-direction: column;
   height: 100%;
}

.vision-text {
   width: 100%;
   display: flex;
   text-align: center;
   flex-direction: column;
   justify-content: center;
   background: #242b1e;
   border-top: 1px solid #3e3a3a;
   border-bottom: 1px solid #3e3a3a;
}