.homepage {
  background-image: url('../images/backgrounds/homepage-bg.png');
  background-position: top center;
  background-size: cover;
  background-repeat: no-repeat;
}

.h-top-s {
  position: relative;

  .swiper-slide {
    width: 100%;
    position: relative;

    &:before {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 50%;
      background: linear-gradient(
        180deg,
        rgba(33, 29, 56, 0) 0%,
        rgba(33, 29, 56, 0.789128) 57.15%,
        rgba(33, 29, 56, 0.937428) 80.04%,
        #211d38 100%
      );
      z-index: 2;
    }
  }

  .container {
    position: relative;
  }
}

.notification-yes-no-holder {
  span {
    top: inherit !important;
    left: inherit !important;
  }

  label {
    p {
      color: #706c88 !important;
      margin-left: 10px !important;
      background-color: transparent !important;
    }
  }

  p {
    margin-left: 0 !important;
  }
}

.t-image-bg {
  position: absolute;
  top: 0;
  left: 0;
  max-width: 100vw;
}

.t-image-bg-new {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  object-position: center center;
  //-o-object-fit: cover;
  //object-fit: cover;
  transform: translate(0, -50%);
  z-index: 1;
}

.top-new-h {
  .swiper-slide {
    &:before {
      height: 60%;
    }

    &:after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 30%;
      background: linear-gradient(
        360deg,
        rgba(33, 29, 56, 0) 0%,
        rgba(33, 29, 56, 0.789128) 50.15%,
        rgba(33, 29, 56, 0.937428) 80.04%,
        #211d38 100%
      );
      z-index: 2;
    }
  }
}

// .image-fit2 {
// 	position: absolute;
// 	top: 0;
// 	left: 0;
// 	right: 0;
// 	margin: 0 auto;
// 	width: auto;
// }

.top-slide-n2 {
  .top-bg-motion-h {
    &:before {
      @include media-breakpoint-down(xs) {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 100%;
        width: 100%;
        background: rgba(0, 0, 0, 0.4);
        z-index: 3;
      }
    }
  }

  .top-bg-motion {
    @include media-breakpoint-down(xs) {
      text-align: center;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 0 10px !important;
      transform: translate(0);
    }
  }

  .top-bg-img {
    @media (max-width: 1350px) {
      height: 100%;
    }

    @include media-breakpoint-down(xs) {
      width: 105% !important;
    }
  }

  .bottom-bg-img {
    @include media-breakpoint-down(xs) {
      object-position: center right !important;
      width: 150% !important;
      margin-left: -10px;
    }
  }
}

.top-slide-n {
  .swiper-slide {
    &:before {
      display: none;
    }
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    @include media-breakpoint-only(md) {
      margin-bottom: 8px !important;
    }
  }

  h3 {
    @include media-breakpoint-down(xs) {
      font-size: 21px !important;
    }
  }

  h4 {
    @include media-breakpoint-down(xs) {
      font-size: 20px !important;
    }
  }

  h5 {
    @include media-breakpoint-down(xs) {
      font-size: 19px !important;
    }
  }

  h6 {
    @include media-breakpoint-down(xs) {
      font-size: 19px !important;
    }
  }
}

.video-slider {
  .h-top-c {
    @include media-breakpoint-down(xs) {
      height: 280px;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
    }
  }
}

.top-bg-motion {
  position: absolute !important;
  top: 50%;
  padding-left: 50px !important;
  transform: translate(0, -50%);
  z-index: 2;

  @include media-breakpoint-down(xs) {
    padding-left: 20px !important;
  }

  button {
    margin-top: 10px;

    @include media-breakpoint-only(md) {
      margin-top: 10px;
    }
  }
}

.top-bg-motion-h {
  position: relative;
  overflow: hidden;
  height: 330px;
  width: 100%;
  border-radius: 10px;

  @include media-breakpoint-down(md) {
    height: 280px;
  }

  @include media-breakpoint-only(sm) {
    height: 219px;
  }

  @include media-breakpoint-down(xs) {
    height: 220px;
  }

  img {
    position: absolute;
    top: 0;
    width: 102%;
    max-width: inherit;

    @include media-breakpoint-down(xs) {
      width: 106%;
    }
  }
}

.top-bg-motion-bg-h {
  background-color: $white;

  .top-bg-motion-img {
    display: none;
  }

  .top-bg-motion-img-i {
    display: none;
  }

  .load-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    filter: blur(10px);
  }
}

.top-show-images {
  .top-bg-motion-img {
    display: inline-block;
  }

  .top-bg-motion-img-i {
    display: inline-block;
  }

  .load-bg {
    display: none;
  }
}

.load-bg {
  height: 100%;
}

.top-bg-img {
  z-index: 1;

  @media (max-width: 1350px) {
    height: 100%;
  }
}

.bottom-bg-img {
  z-index: 2;
}

.top-bg-movie {
  position: relative;
  overflow: hidden;
  height: 330px;
  width: 100%;
  border-radius: 10px;

  @include media-breakpoint-only(md) {
    height: 280px;
  }

  @include media-breakpoint-only(sm) {
    height: 219px;
  }

  @include media-breakpoint-down(xs) {
    height: 220px;
  }

  &:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
      90deg,
      rgba(0, 204, 0, 1) 0%,
      rgba(0, 212, 255, 0) 50%
    );
    z-index: 2;
  }

  video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-position: center center;
    object-fit: cover;
  }
}

.top-bg-movie-s {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.top-movies {
  .h-top-c {
    padding-left: 0;
    text-align: center;
    margin: 0 auto;
  }
}

.top-bg-s-h {
  position: relative;
  display: block;
  border-radius: 14px;
  overflow: hidden;
  transition: all 0.26s ease-in-out;

  &:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 15px 1px rgba(16, 42, 136, 0.2);
  }

  picture {
    object-fit: cover;
  }

  img {
    // width: 100%;
    // height: 100%;
    object-position: center center;
    object-fit: cover;
  }
  &--threeInRow {
    width: max-content;
    height: 100%;
    @include media-breakpoint-only(md) {
      width: max-content;
      height: 100%;
    }

    @include media-breakpoint-only(sm) {
      width: max-content;
      height: 100%;
    }

    @include media-breakpoint-down(xs) {
      width: 100%;
      height: 100%;
    }
  }
  &:not(.top-bg-s-h--threeInRow) img {
    width: 100%;
  }
}

.h-top-buttons {
  cursor: pointer;
  display: none;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  z-index: 2;

  svg {
    width: 20px;
  }
}

.home-top-button-slider-next {
  right: 20px;
  transform: rotate(180deg);
}

.home-top-button-slider-prev {
  left: 20px;
}

.home-top-button-slider {
  position: absolute;
  top: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #363057;
  z-index: 2;
}

.top-bg-motion-img {
  position: absolute;
  top: 0;
  width: 102%;
  margin-left: -10px;
  max-width: inherit;
  -webkit-animation: linear infinite;
  -webkit-animation-name: bg-motion;
  -webkit-animation-duration: 10s;

  @include media-breakpoint-down(xs) {
    width: 110%;
    height: 100%;
    object-position: center left;
    object-fit: cover;
  }
}

@-webkit-keyframes bg-motion {
  0% {
    left: -10px;
  }

  50% {
    left: 10px;
  }

  100% {
    left: -10px;
  }
}

.top-bg-motion-img-i {
  position: absolute;
  top: inherit !important;
  bottom: 0;
  width: 102%;
  max-width: inherit;
  -webkit-animation: linear infinite;
  -webkit-animation-name: img-motion;
  -webkit-animation-duration: 10s;

  @include media-breakpoint-down(xs) {
    width: 110%;
    height: 100%;
    object-position: center center;
    object-fit: cover;
  }
}

@-webkit-keyframes img-motion {
  0% {
    left: 15px;
  }

  50% {
    left: -15px;
  }

  100% {
    left: 15px;
  }
}

.t-image-bg1 {
  @media (max-width: 1500px) {
    display: none;
  }
}

.t-image-bg2 {
  display: none;

  @media (min-width: 1200px) and (max-width: 1500px) {
    display: block;
  }
}

.t-image-bg3 {
  display: none;

  @media (min-width: 992px) and (max-width: 1199px) {
    display: block;
  }
}

.t-image-bg4 {
  display: none;

  @include media-breakpoint-down(sm) {
    display: block;
  }

  @media (max-width: 530px) {
    object-position: right 0 top 0 !important;
  }
}

.naviagation-top {
  font-size: 0;
  height: 8px;

  .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    opacity: 1;
    background: $white;
    transition: 0.3s ease;
  }

  .swiper-pagination-bullet-active {
    height: 8px;
    width: 26px;
    background-color: $blue;
    border-radius: 10px;
  }
}

.h-top-slider {
  &:hover {
    .h-top-buttons {
      display: block;
    }
  }

  .container {
    min-height: 300px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    @media screen and (max-width: 576px) {
      min-height: 190px;
    }
  }

  .swiper {
    width: 100%;
    height: 100%;
  }

  .swiper-slide {
    // width: auto;
    // flex-shrink: 0;
    // display: block;
    height: auto;

    .pt-md-40 {
      padding-top: 10px !important;
      padding-bottom: 10px !important;
      display: flex;

      @include media-breakpoint-down(xs) {
        padding-top: 10px !important;
      }
    }
  }
}

.h-top-c {
  padding-right: 10px;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  padding-left: 12%;
  font-size: 0;
  position: relative;
  z-index: 3;

  @include media-breakpoint-down(xs) {
    padding-left: 20px;
  }

  h1 {
    width: 100%;
    font-size: 40px;
    @extend .fw-extraBold;
    color: $black;
    margin-bottom: 7px;

    @include media-breakpoint-only(md) {
      font-size: 30px;
    }

    @include media-breakpoint-down(sm) {
      font-size: 24px;
      margin-bottom: 6px !important;
    }
  }

  h2 {
    width: 100%;
    font-size: 38px;
    @extend .fw-extraBold;
    color: $black;
    margin-bottom: 7px;

    @include media-breakpoint-only(md) {
      font-size: 30px;
    }

    @include media-breakpoint-down(sm) {
      font-size: 22px;
      margin-bottom: 6px !important;
    }
  }

  h3 {
    width: 100%;
    font-size: 36px;
    @extend .fw-extraBold;
    color: $black;
    margin-bottom: 7px;

    @include media-breakpoint-only(md) {
      font-size: 30px;
    }

    @include media-breakpoint-down(sm) {
      font-size: 20px;
      margin-bottom: 6px !important;
    }
  }

  h4 {
    width: 100%;
    font-size: 35px;
    @extend .fw-extraBold;
    color: $black;
    margin-bottom: 7px;

    @include media-breakpoint-only(md) {
      font-size: 30px;
    }

    @include media-breakpoint-down(sm) {
      font-size: 18px;
      margin-bottom: 6px !important;
    }
  }

  h5 {
    width: 100%;
    font-size: 34px;
    @extend .fw-extraBold;
    color: $black;
    margin-bottom: 7px;

    @include media-breakpoint-only(md) {
      font-size: 28px;
    }

    @include media-breakpoint-down(sm) {
      font-size: 17px;
      margin-bottom: 6px !important;
    }
  }

  h6 {
    width: 100%;
    font-size: 32px;
    @extend .fw-extraBold;
    color: $black;
    margin-bottom: 7px;

    @include media-breakpoint-only(md) {
      font-size: 27px;
    }

    @include media-breakpoint-down(sm) {
      font-size: 17px;
      margin-bottom: 6px !important;
    }
  }

  p {
    width: 100%;
    color: $black;
    font-size: 22px;
    @extend .fw-extraBold;
    margin-bottom: 7px;

    @include media-breakpoint-only(md) {
      font-size: 20px;
    }

    @include media-breakpoint-down(sm) {
      font-size: 16px;
      margin-bottom: 20px;
    }

    strong {
      color: $orange;
    }
  }

  li {
    position: relative;
    font-size: 20px;
    padding-left: 20px;
    line-height: 20px;
    color: $white;
    margin-bottom: 4px;

    &:before {
      content: '';
      position: absolute;
      top: 10px;
      left: 0;
      width: 4px;
      height: 4px;
      background-color: $white;
      border-radius: 50%;
    }
  }

  button {
    background-color: #00cc00;
    padding: 13px 70px;

    @include media-breakpoint-down(sm) {
      font-size: 14px;
      padding: 8px 39px;
    }
  }
}

.button-disabled {
  pointer-events: none;
  filter: grayscale(90%);
}

.filter-s {
  // .container {
  // 	max-width: 100%;
  // 	padding: 0 50px;
  // 		@include media-breakpoint-only(md) {
  // 			padding: 0 30px;
  // 		}

  // 		@include media-breakpoint-down(sm) {
  // 			padding: 0 10px;
  // 		}
  // }

  .container-mobile-s {
    margin-bottom: 20px;

    @include media-breakpoint-down(md) {
      padding-bottom: 4px !important;

      //overflow-x: scroll;
      // scrollbar-width: thin !important;
      // scrollbar-color: #8C34FC rgba(172, 172, 191, 0.06);
      .simplebar-track.horizontal {
        height: 2px;
        background: rgba(172, 172, 191, 0.06) !important;

        .simplebar-scrollbar {
          height: 2px;
          top: 0 !important;
          visibility: visible !important;

          &:before {
            opacity: 1 !important;
            background: $blue !important;
          }
        }
      }
    }
  }

  // .container::-webkit-scrollbar {
  //    height: 2px;
  //  }

  //  .container::-webkit-scrollbar-track {
  //    background: rgba(172, 172, 191, 0.06);
  //  }

  //  .container::-webkit-scrollbar-thumb {
  //    background: #8C34FC;
  //  }
}

.filter-moving {
  position: sticky;
  top: 63px;
  left: 0;
  z-index: 99;
  background-color: #ebedf4;
  margin-bottom: 30px;

  @include media-breakpoint-down(xs) {
    top: 57px;
  }
}

.filter-h {
  padding-top: 0 !important;

  //padding-bottom: 20px !important;
  @include media-breakpoint-down(sm) {
    white-space: nowrap;
  }

  @include media-breakpoint-down(xs) {
    padding-bottom: 0 !important;
  }

  .row {
    @include media-breakpoint-down(sm) {
      flex-wrap: inherit;
    }
  }

  ul {
    display: flex;
    padding-right: 20px;

    //justify-content: flex-start !important;
    @include media-breakpoint-down(sm) {
      padding-right: 0;
      //flex-wrap: wrap;
      white-space: nowrap;
      justify-content: flex-start !important;
    }
  }

  li {
    position: relative;
    padding: 8px 0;
    transition: 0.3s ease;
    border-bottom: 1px solid transparent;

    &:hover {
      border-bottom: 1px solid $yellow;

      @include media-breakpoint-down(sm) {
        border-bottom: 1px solid transparent;
      }

      img {
        filter: grayscale(0);

        @include media-breakpoint-down(sm) {
          filter: grayscale(100%);
        }
      }

      p {
        color: $white;
      }
    }

    // @include media-breakpoint-only(sm) {
    // 	flex: 0 0 20%;
    //  		max-width: 20%;
    //  		margin-bottom: 5px;
    // }

    // @include media-breakpoint-only(sm) {
    // 	flex: 0 0 33.33%;
    //  		max-width: 33.33%;
    // 	margin-bottom: 5px;
    // }

    // @include media-breakpoint-down(xs) {
    // 	flex: 0 0 50%;
    //  		max-width: 50%;
    // 	margin-bottom: 10px;
    // }
  }

  li + li {
    // 	margin-left: 11px;
    // 		@include media-breakpoint-only(md) {
    // 			margin-left: 4px;
    // 		}

    @include media-breakpoint-down(sm) {
      margin-left: 47px;
    }
  }

  .providers-button {
    padding: 0;
    border-bottom: none !important;
  }

  a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
  }

  .open-providers {
    width: 100%;
    height: 100%;
    padding: 10px 10px;
    border-radius: 10px;
    background-color: #f6f6fa;
    border: 2px solid #dfe2ee;
    margin-left: 0;
    z-index: 2;
    transition: all 0.26s ease-in-out;

    &__pre-text {
      color: #4667dc;
    }

    &__text {
      color: #18191c;
    }

    &:hover {
      background-color: #dfe2ee;
      border-color: #babed1;
    }
  }

  p {
    line-height: 16px;
    transition: 0.3s ease;

    @include media-breakpoint-only(md) {
      font-size: 10px;
    }
  }

  img {
    filter: grayscale(1);
    transition: 0.3s ease;

    @include media-breakpoint-only(md) {
      max-width: 30px;
    }
  }

  button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-left: 10px;
    border-radius: 50%;
    background-color: #363057;

    &:hover {
      background: #322c53;
    }
  }
}

.mobile-homepage-button {
  padding-top: 10px;

  .row {
    margin: 0 -5px;
  }

  .col-6 {
    padding: 0 5px;
  }

  .col-6:first-child {
    img {
      margin-top: -4px;
    }
  }

  a {
    display: block;
    text-align: center;
    height: 100%;
    @extend .fw-bold;
    font-size: 14px;
    padding: 7px 10px;
    border-radius: 7px;
    background: #363057;
  }

  img {
    margin-right: 5px;
  }
}

.header-image-s {
  .h-top-c {
    padding-left: 40px !important;

    @include media-breakpoint-down(sm) {
      height: 230px !important;
      padding-left: 10px !important;
    }
  }

  .top-bg-motion-h {
    @include media-breakpoint-down(xs) {
      height: 230px;
    }
  }

  .top-bg-movie {
    @include media-breakpoint-down(xs) {
      height: 230px;
    }
  }

  .top-bg-s-h {
    @include media-breakpoint-down(xs) {
      height: 230px;
    }
    &--threeInRow {
      @include media-breakpoint-down(xs) {
        height: auto;
      }
    }

    img {
      @include media-breakpoint-down(xs) {
        object-position: right center;
      }
    }
  }
}

.filters-mobile {
  margin-top: 10px;
  margin-bottom: 20px;

  .container {
    padding-top: 10px !important;
    padding-bottom: 0 !important;

    @include media-breakpoint-down(md) {
      padding: 0 10px;
    }
  }
}

.filters-mobile.filter-moving {
  margin-bottom: inherit;

  .container.pt-10 {
    padding-top: 10px !important;
  }
}

.mobile-filter {
  text-align: center;
  font-size: 0;
  display: block;
  flex-wrap: wrap;
  white-space: nowrap;
  margin-bottom: 0 !important;

  @include media-breakpoint-down(md) {
    display: flex;
    padding-bottom: 0 !important;
  }

  &__item {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    @include media-breakpoint-down(md) {
      flex-direction: row;
      justify-content: center;
      gap: 6px;
    }
  }

  &__item-text {
    margin: 10px 0 0;
    @extend .fw-semiBold;
    font-size: 14px;
    color: #18191c;
    white-space: nowrap;
    @include media-breakpoint-down(md) {
      margin: 0;
    }
  }

  &__wrap {
    display: grid;
    grid-template-columns: 1fr 124px;
    align-items: center;
    gap: 6px;
    @include media-breakpoint-down(md) {
      grid-template-columns: 1fr;
    }
  }

  &__list-wrap {
    width: 100%;
  }

  &__wrap-menu {
    justify-content: space-between;
    align-items: center;
    gap: 6px;
  }

  &__wrap-submenu {
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    height: 100%;
  }

  ul {
    display: flex;
    text-align: left;

    @include media-breakpoint-down(md) {
      margin-bottom: 10px !important;
    }
  }

  &__wrap-menu-item {
    text-align: center;
    display: inline-block;
    vertical-align: top;
    height: 100%;
    flex: 0 0 auto;
    max-width: 124px;
    width: 100%;
    border: none;
    @include media-breakpoint-down(md) {
      flex-grow: 1;
      flex-basis: 0;
      max-width: 100%;
    }

    a,
    button {
      padding: 20px 14px 10px;
      height: 100%;
      display: flex;
      flex-direction: column;
      flex-wrap: nowrap;
      align-items: center;
      justify-content: center;
      background-color: $white;
      border: none;
      border-radius: 15px;
      border: 2px solid transparent;
      transition: 0.26s all ease-in-out;

      &:hover {
        color: #f6f6fa;
        background-color: #dfe2ee;
      }

      @include media-breakpoint-down(md) {
        padding: 10px 14px;
        border-radius: 100px;
      }
    }

    button {
      width: 100%;

      @include media-breakpoint-only(md) {
        min-width: inherit;
      }
    }
  }

  picture {
    margin: 0;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    @include media-breakpoint-down(md) {
      width: 30px;
      height: 30px;
    }

    img {
      max-width: unset;
      width: 50px;
      flex: 0 0 auto;
      transition: transform 0.26s cubic-bezier(0.41, 0.52, 0.42, 2.4);
      @include media-breakpoint-down(md) {
        width: 30px;
      }
    }
  }

  li + li {
    margin-left: 9px;
  }

  &__wrap-menu-search {
    display: none;
    @include media-breakpoint-only(md) {
      min-width: inherit;
    }
  }

  .open-providers {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 20px 14px 10px;
    border-radius: 14px;
    background-color: #f6f6fa;
    border: 2px solid #dfe2ee;
    margin-left: 0;
    z-index: 2;
    transition: all 0.26s ease-in-out;

    &::before {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      padding: 7px;
      width: 32px;
      height: 32px;
      color: $white;
      background-color: #dfe2ee;
      background-image: url('../images/icons/settings-provider.svg');
      background-size: 24px;
      background-position: center center;
      background-repeat: no-repeat;
      border-radius: 0 10px 0 14px;
      transition: all 0.26s ease-in-out;
    }

    &__pre-text {
      margin: 10px 0 0;
      @extend .fw-semiBold;
      font-size: 12px;
      color: #4667dc;
    }

    &__text {
      margin: 10px 0 0;
      @extend .fw-semiBold;
      font-size: 16px;
      color: #18191c;
    }

    &:hover {
      background-color: #dfe2ee;
      border-color: #babed1;
      &::before {
        background-color: #babed1;
      }
    }
  }

  .current-mobile-filter {
    a,
    button {
      background-color: $blue;
      border-color: $blue;
    }

    .mobile-filter__item-text {
      @extend .fw-semiBold;
      font-size: 14px;
      color: $white;
      white-space: nowrap;
    }
  }

  &__wrap-menu-providers {
    text-align: center;
    display: inline-block;
    vertical-align: top;
    height: 100%;
    flex: 0 0 auto;
    max-width: 124px;
    width: 100%;
    border: none;
    @include media-breakpoint-down(md) {
      flex-grow: 1;
    }

    a,
    button {
      padding: 20px 14px 10px;
      height: 100%;
      display: flex;
      flex-direction: column;
      flex-wrap: nowrap;
      align-items: center;
      justify-content: center;
      background-color: $white;
      border: none;
      border-radius: 15px;
      border: 2px solid transparent;
      transition: 0.26s all ease-in-out;

      &:hover {
        color: #f6f6fa;
        background-color: #dfe2ee;
      }
    }

    button {
      width: 100%;

      @include media-breakpoint-only(md) {
        min-width: inherit;
      }
    }
  }
}

.find-game-b {
  position: relative;
  text-align: left;
  color: #9b9bad;
  font-size: 14px;
  width: 220px;
  padding: 12px 10px 12px 50px;
  background: #151518;
  border: 1px solid #303039;
  border-radius: 5px;
  margin-left: 10px;

  img {
    position: absolute;
    top: 13px;
    left: 17px;
  }
}

.find-game-desktop {
  position: relative;
  vertical-align: middle;

  img {
    position: absolute;
    top: 14px;
    left: 25px;
  }
}

.mobile-search-c.mobile-search-h {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  margin-top: 0 !important;
  margin-bottom: 10px;
  display: none;

  @include media-breakpoint-down(md) {
    margin-top: -10px !important;
  }

  @include media-breakpoint-down(sm) {
    display: inline-block;
  }

  button,
  input {
    background-color: $white;
    border-radius: 100px;
  }

  .open-providers {
    width: 42px;
    height: 42px;
    background-color: $white;
    border: none;
    border-radius: 10px;
    transition: 0.26s all ease-in-out;

    &:hover {
      background-color: #f6f6fa;

      p {
        color: $black !important;
      }
    }
  }
}

.modal-provider {
  .modal-dialog {
    max-width: 1200px;

    @include media-breakpoint-down(xs) {
      margin: 0;
    }
  }

  .modal-content {
    border: 0;
    border-radius: 14px;
    background: #ebedf4;

    @include media-breakpoint-down(xs) {
      border-radius: 0;
    }
  }
}
#modal-search {
  button#searchbar_clear_content[data-dismiss='modal'] {
    position: absolute;
    top: 20px;
    right: 16px;
    z-index: 2;
  }
}

.providers-modal-h {
  position: relative;
  padding: 20px 10px;

  button[data-dismiss='modal'] {
    position: absolute;
    top: 5px;
    right: 5px;
    z-index: 2;

    @include media-breakpoint-down(xs) {
      top: 20px;
      right: 10px;
    }
  }

  &__close-modal {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #f6f6fa;
    z-index: 1;

    &:hover {
      background-color: #ededed;
    }
  }

  ul {
    padding: 0;
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-auto-rows: minmax(0, 1fr);
    gap: 4px;

    @include media-breakpoint-down(md) {
      grid-template-columns: repeat(6, 1fr);
    }

    @include media-breakpoint-down(sm) {
      grid-template-columns: repeat(5, 1fr);
    }

    @include media-breakpoint-down(xsm) {
      grid-template-columns: repeat(4, 1fr);
    }

    @include media-breakpoint-down(xs) {
      grid-template-columns: repeat(3, 1fr);
    }
  }

  &__item {
    position: relative;
  }

  a {
    position: relative;
    padding: 10px 16px;
    width: auto;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #6d6d6d;
    border: 2px solid #6d6d6d;
    border-radius: 14px;

    &:hover {
      border-color: $blue;
    }
  }

  img {
    display: inline-block;
    object-fit: contain;
    user-select: none;
  }

  p {
    display: block;
    font-size: 12px;
    line-height: 14px;
    color: $gray-600;
  }
}

.notifications-link {
  display: block;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.providers-order {
  position: relative !important;
  display: block;
  top: inherit !important;
  right: inherit !important;
  @extend .fw-bold;
  color: $black;

  &:before {
    content: '';
    position: absolute;
    top: -4px;
    left: 0;
    right: 0;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #fff;
    margin: 0 auto;
  }

  &:after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    right: 0;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #fff;
    margin: 0 auto;
  }
}

.providers-orders {
  color: #facd0d;

  &:before {
    content: '';
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #facd0d;
  }

  &:after {
    content: '';
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #facd0d;
  }
}

.playfina__login-button {
  width: 100%;
  // max-width: 155px;
  background-color: #4667dc;
  border-radius: 100px;
  &:hover {
    background-color: #1939a8;
  }
}

.playfina__register-button {
  width: 100%;
  // max-width: 155px;
  background-color: #1ebe04;
  border-radius: 100px;
  &:hover {
    background-color: #188107;
  }
}

.mobile-balance {
  @include media-breakpoint-down(xs) {
    margin-bottom: 10px !important;
  }
}

.sarch-provider-top {
  padding: 0 30px 0 10px;
  margin-bottom: 20px;

  @include media-breakpoint-down(xs) {
    padding: 0 10px;
  }

  h2 {
    @include media-breakpoint-down(xs) {
      margin-bottom: 12px;
    }
  }

  input {
    height: 40px !important;

    @include media-breakpoint-down(sm) {
      height: 46px !important;
    }
  }
}

.mobile-currency {
  text-align: center;
  position: relative;
  border-radius: 6px;
  padding: 36px 20px 6px 20px;

  .col {
    text-align: center;
  }

  h3 {
    text-align: center;
    position: relative;
    display: inline-block;
    font-size: 32px;
    @extend .fw-semiBold;
    color: $orange;

    span {
      position: absolute;
      bottom: 110%;
      left: 0;
      font-size: 11px;
      color: #acacbf;
    }
  }
}

.balance-h {
  .t-currency {
    padding: 0;
  }

  .currency-s {
    margin-bottom: 15px !important;

    p {
      margin-bottom: 10px;
    }
  }

  .cash-mobile {
    p {
      font-size: 13px;
      margin-bottom: 5px;
    }

    h2 {
      text-align: left;
      color: #ffffff;
      font-size: 14px;
      margin-bottom: 0;
    }

    button {
      padding: 6px 19px;
    }
  }
}

.cash-button-mobile-h {
  margin: 0 -3px;

  .col-6 {
    padding: 0 3px;
  }
}

.cash-button-mobile {
  display: block;
  text-align: center;
  color: #acacbf;
  @extend .fw-semiBold;
  padding: 10px 10px;
  font-size: 14px;
  background: rgba(172, 172, 191, 0.12);
  border-radius: 6px;
}

.mobile-currency-choose {
  position: absolute;
  top: 60%;
  right: 20px;
  transform: translate(0, -60%);
}

.deposit-buttons {
  display: block;
  text-align: center;
  @extend .fw-semiBold;
  color: #fff;
  font-size: 15px;
  padding: 10px 10px;
  border-radius: 5px;
  margin-top: 10px;
  background-color: #04c000;

  &:hover {
    color: #fff;
    background-color: #039400;
  }
}

.search-mobile {
  position: relative;

  button,
  input {
    text-align: left;
    width: 100%;
    height: 44px;
    background: $white;
    color: #babed1;
    padding: 0 10px 0 40px;
    font-size: 13px;
    border-radius: 100px;

    &::placeholder {
      color: #babed1;
      font-size: 13px;
    }
  }

  svg {
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translate(0, -50%);
  }
}

.a-title {
  img {
    @include media-breakpoint-down(sm) {
      max-width: 30px;
    }
  }

  h2 {
    @include media-breakpoint-down(sm) {
      font-size: 18px;
    }
  }
}

.view-all-m {
  padding: 8px 13px;
  font-size: 12px;
  background: rgba(172, 172, 191, 0.06);

  svg {
    margin-top: -2px;
    margin-left: 14px;
  }
}

.mobile-search-c {
  margin-top: 5px !important;

  .filter-h {
    width: auto;
  }
}

.right-menu-button {
  @include media-breakpoint-down(xs) {
    display: none !important;
  }
}

.left-side-button {
  display: none;

  @include media-breakpoint-down(xs) {
    display: inline-block;
  }
}

.left-side-menu-mobile {
  display: none;

  @include media-breakpoint-down(xs) {
    display: block;
    position: fixed;
    top: 0;
    left: -100%;
    padding: 10px 10px 120px 10px;
    width: 100%;
    height: 100vh;
    z-index: 99;
    overflow-y: scroll;
    transition: 0.3s ease;
    background-color: #151518;
  }
}

.logged-top-menus {
  margin-bottom: 8px;

  li {
    display: inline-block;
    vertical-align: middle;
  }

  span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 19px;
    height: 19px;
    border-radius: 5px;
    background: rgba(172, 172, 191, 0.2);
  }
}

.tournaments-load {
  text-align: center;
  margin-bottom: 30px;

  a {
    position: static !important;
    display: inline-block !important;
    padding: 9.5px 30px !important;
  }
}

.slot-link {
  padding: 10px 0 0;
  font-size: 12px;
  color: #686c7d;
  background-color: $white;
  &:hover {
    color: $black;
  }
}

.slot-mobiles {
  .slots-hold {
    .col {
      @include media-breakpoint-down(xs) {
        flex: 0 0 50% !important;
        max-width: 50% !important;
      }
    }
  }

  .row {
    justify-content: inherit !important;
  }
}

.left-menu-mobile {
  overflow: hidden;
  touch-action: none;
  z-index: -1;

  .left-side-menu-mobile {
    left: 0;
  }
}

.menu-level {
  position: relative;
  margin-bottom: 5px;

  .password-show-popup {
    position: relative;
    padding: 0;
    display: inline;
    top: 0;
    right: 0;
  }

  .password-show-c {
    top: 170%;
    left: 0;
    margin-left: -5px;
    right: inherit;

    &:before {
      right: inherit;
      left: 10px;
    }
  }

  p {
    font-size: 12px;
    line-height: 15px;
    padding-right: 20px;
    color: #acacbf;
    margin-bottom: 5px;
  }

  h2 {
    font-size: 12px;
    @extend .fw-semiBold;
    line-height: 18px;
    color: #acacbf;
    margin-right: 4px;
  }

  button {
    img {
      display: block;
    }
  }
}

.p-level {
  display: block;
  position: relative;
  height: 4px;
  border-radius: 30px;
  background-color: rgba(172, 172, 191, 0.12);

  span {
    position: absolute;
    top: 0;
    left: 0;
    height: 4px;
    border-radius: 30px;
    background-color: #facd0d;
  }
}

.icon-level {
  position: relative;
  top: -2px;
}

.deposit-left-menu {
  display: block;
  text-align: center;
  font-size: 15px;
  padding: 10px;
  color: #fff;
  @extend .fw-semiBold;
  line-height: 19px;
  border-radius: 100px;
  background: #04c000;
  margin-bottom: 5px;

  &:hover {
    color: #fff;
    background-color: #039400;
  }
}

.slots-big {
  .row {
    margin-bottom: 0 !important;

    @include media-breakpoint-down(xs) {
      width: 960px !important;
    }
  }

  .col {
    flex: 0 0 16.6% !important;
    max-width: 16.6% !important;
    margin-bottom: 20px;
    @include media-breakpoint-down(xs) {
      max-width: 16.6% !important;
    }
  }

  .swiper-slide {
    max-width: 204px !important;

    @include media-breakpoint-only(md) {
      max-width: 140px !important;
    }

    @include media-breakpoint-only(sm) {
      max-width: 134px !important;
    }

    @include media-breakpoint-down(xs) {
      max-width: 154px !important;
    }
  }

  .slots-img {
    height: 202px;

    @include media-breakpoint-only(md) {
      height: 139px;
    }

    @include media-breakpoint-only(sm) {
      height: 134px;
    }

    @include media-breakpoint-down(xs) {
      height: 154px;
    }
  }

  .slots-on-line {
    margin: 0;
    width: 100%;
    // @include media-breakpoint-down(xs) {
    // 	width: auto !important;
    // }

    .slots-img {
      @include media-breakpoint-only(sm) {
        height: 117px;
      }
    }
  }

  .hovered-slot-content {
    top: 50%;
    bottom: inherit;
    transform: translate(0, -50%);
  }

  .play-for-fun-home-icon {
    margin-bottom: 0 !important;
  }
}

.games-find-h {
  padding: 20px 0;

  @include media-breakpoint-down(xs) {
    overflow: hidden;
  }

  ul {
    display: flex;
    justify-content: space-between;

    @include media-breakpoint-down(xs) {
      overflow-x: scroll;
      white-space: nowrap;
    }
  }

  li {
    text-align: center;
    display: inline-block;
  }

  li + li {
    @include media-breakpoint-down(xs) {
      margin-left: 20px;
    }
  }

  span {
    display: block;
  }

  a {
    &:hover {
      .games-find-icon {
        opacity: 0.7;
      }

      .games-find-name {
        text-decoration: underline;
      }
    }
  }

  .games-find-icon {
    height: 35px;
    margin-bottom: 5px;

    @include media-breakpoint-only(sm) {
      max-width: 30px;
      margin: 0 auto;
    }
  }

  .games-find-name {
    font-size: 16px;
    @extend .fw-semiBold;
    color: #ffffff;

    @include media-breakpoint-only(sm) {
      font-size: 14px;
    }
  }
}

.modal-inputs {
  background-color: #fff !important;
}

.card-inputs {
  .card-inputs-c {
    margin-bottom: 20px;
  }

  label {
    display: block;
    position: relative;
    margin-bottom: 2px !important;
  }

  input {
    font-size: 16px !important;
  }

  input:focus + span {
    top: -9px;
    left: 0;
    transform: scale(0.9);
  }

  input:placeholder-shown + span {
    top: 0;
  }

  span {
    position: absolute;
    left: 2px;
    display: inline-block;
    top: 14px;
    font-size: 15px;
    color: #706c88;
    padding: 0 14px;
    background-color: #fff;
    transition: 0.3s ease;
  }

  p {
    display: none;
    font-size: 14px !important;
    margin-bottom: 0 !important;
  }

  .birth {
    position: relative;
    border: 1px solid #e0e0e4;
    border-radius: 6px;

    select {
      width: auto;
      display: inline-block;
      border: none;
      appearance: none;
      background: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23000000%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E')
        right 0 center;
      background-size: 10px;
      margin-right: 10px;
      background-repeat: no-repeat;
    }
  }

  .phone-content {
    position: static;
  }

  .phone-c {
    background: #f7f8f9 !important;

    .phone-content {
      color: #706c88;
      background: #f7f8f9 !important;
    }

    li {
      button {
        &:hover {
          background: #cee1ce !important;

          .phone-content {
            background: #cee1ce !important;
          }
        }
      }
    }
  }
}

.birth-c {
  span {
    top: -9px;
    left: 0;
    transform: scale(0.9);
  }
}

.placeholder-input {
  span {
    top: -9px !important;
    left: 0;
    transform: scale(0.9);
  }
}

.card-error {
  span {
    color: $red;
    top: -9px;
    left: 0;
    transform: scale(0.9);
  }

  // input[value]:not([value=""]) + span {
  // 	top: -6px;
  // 	left: 10px;
  // 	right: inherit;
  // 	font-size: 12px;
  // }

  input {
    border: 1px solid $red !important;
  }

  p {
    display: block;
    padding: 4px 6px;
    color: $red !important;
    margin-top: 4px;
    background-color: #ffd7dc;
    border-radius: 6px;
  }
}

.card-green {
  input {
    border: 1px solid $blue !important;
  }

  span {
    top: -9px;
    color: $blue;
    left: 0;
    transform: scale(0.9);
  }
}

.cash-mobile {
  padding: 10px 10px;
  border-radius: 6px;
  border: 1px dashed rgba(172, 172, 191, 0.26);
  margin-bottom: 10px;

  p {
    font-size: 12px;
    color: #acacbf;
    line-height: 15px;
    margin-bottom: 4px;
  }

  h2 {
    font-size: 14px;
    @extend .fw-semiBold;
    color: #fff;
    line-height: 18px;
  }

  button {
    padding: 10px 25px;
    font-size: 12px;
    color: #facd0d;
    border-radius: 4px;
    background: rgba(172, 172, 191, 0.1);

    &:hover {
      background: rgba(172, 172, 191, 0.2);
    }
  }
}

.left-menu-mobile-link {
  padding-top: 5px;
  border-top: 1px solid rgba(53, 49, 58, 0.5);

  h3 {
    color: #f1eef5;
    font-size: 13px;
    padding: 10px 0 5px 5px;
  }

  li {
    position: relative;
    padding: 5px 15px;
    margin-bottom: 10px;
  }

  picture {
    max-width: 25px;
    margin-right: 12px;
  }

  h2 {
    font-size: 16px;
    @extend .fw-semiBold;
    color: #acacbf;
  }

  p {
    color: #acacbf;
    font-size: 11px;
  }

  button {
    text-align: left;
  }
}

.promotion-mobile {
  overflow: hidden;

  button {
    position: relative;
    width: 100%;
  }

  .promotion-mobile-img {
    position: absolute;
    top: 5px;
    right: 0;
  }

  .promotion-mobile-h:last-child {
    &:after {
      content: '';
      position: absolute;
      top: 51%;
      bottom: 0;
      left: -30px;
      width: 30px;
      background-color: #151518;
      z-index: 2;
    }
  }
}

.bonus-image-b {
  position: relative;
  overflow: hidden;
  border-radius: 10px;

  .row {
    display: none;
  }

  .g-bonus-big {
    min-height: inherit;
    padding-bottom: 47% !important;
  }

  .g-bonus-ch {
    display: none;
  }

  .text-center {
    display: none;
  }

  .bonuses-icons-h {
    z-index: 3;
  }
}

.tournaments-big-link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 4;
}

.g-bonus-small.bonus-image-b {
  min-height: inherit;
  padding-bottom: 47% !important;

  @include media-breakpoint-only(sm) {
    padding-bottom: 47% !important;
  }

  @include media-breakpoint-down(xs) {
    min-height: inherit;
    padding-bottom: 40% !important;
  }

  .tournaments-image-big {
    object-fit: fill;
  }
}

.tournaments-image-big {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-position: center center;
  object-fit: fill;
  z-index: 2;
}

.bonus-code-edit-c {
  text-align: center;
  padding: 16px 14px 16px 10px;
  background: rgba(172, 172, 191, 0.06);
  border-radius: 6px;
}

.bonus-code-edit-c p {
  color: #acacbf;
  font-size: 16px;
  @extend .fw-semiBold;
}

.bonus-code-edit-c p strong {
  color: #facd0d;
  @extend .fw-bold;
}

.bonus-code-get-c a {
  text-align: center;
  display: block;
  color: #ffffff;
  padding: 17px 10px;
  font-size: 16px;
  @extend .fw-bold;
  background: #04c000;
  border-radius: 6px;
}

.bonus-code-get-c a:hover {
  background: #039400;
}

.promotion-mobile-s {
  &:before {
    content: '';
    position: absolute;
    top: 20px;
    left: 25px;
    height: 100%;
    border-right: 1px dashed rgba(172, 172, 191, 0.5);
  }

  &:after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 30px;
    height: 20px;
    background-color: #151518;
  }

  .promotion-mobile-h {
    display: block;
  }
}

.bonus-style {
  position: absolute;
  top: -10px;
  right: -4px;
}

.bonus-style-h {
  display: inline-block;
  margin: 0 0 5px 5px;

  span {
    display: block;
    padding: 2px 7px;
    font-size: 10px;
    border-radius: 30px;
  }
}

.promotion-mobile-h {
  display: none;
  position: relative;
  padding: 12px 10px;
  margin-left: 35px;
  margin-bottom: 5px;
  border-radius: 6px;
  background: rgba(172, 172, 191, 0.1);

  &:before {
    content: '';
    position: absolute;
    top: 51%;
    left: -25px;
    width: 25px;
    border-bottom: 1px dashed rgba(172, 172, 191, 0.5);
  }

  h2 {
    font-size: 14px;
    color: #ffffff;
  }

  p {
    font-size: 11px;
    color: #acacbf;
  }

  h4 {
    font-size: 12px;
    color: #facd0d;
  }
}

.bottom-mobile-payments {
  a {
    display: block;
    padding: 10px 10px;
    border: 1px solid #363057;
    border-radius: 6px;
    margin-bottom: 10px;
  }

  p {
    font-size: 15px;
    @extend .fw-semiBold;
    color: #acacbf;
  }
}

.no-logged {
  padding: 0 0 10px 0;

  .left-menu-mobile-link {
    margin: 0 10px;
  }

  .bottom-mobile-payments {
    margin: 0 10px;
  }

  .bottom-logo {
    margin: 0 10px;
  }
}

.close-left-mobile {
  position: absolute;
  display: none;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  top: 12px;
  right: 12px;
  z-index: 2;
  @media screen and (max-width: 2000px) {
    display: inline-block;
  }
}

.nologged-mobile {
  padding: 20px 10px;

  .close-left-mobile {
    position: absolute;
    display: none;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    top: 12px;
    right: 12px;
    z-index: 2;
    @media screen and (max-width: 2000px) {
      display: inline-block;
    }
  }

  .hide-sidebar {
    position: absolute;
    top: 12px;
    right: -13px;
    padding: 6px 3px 6px 7px;
    width: 34px;
    height: 34px;
    display: none;
    align-items: center;
    justify-content: center;
    background-color: #f6f6fa;
    border-radius: 100px 0 0 100px;
    z-index: 2;
  }

  h2 {
    @extend .fw-extraBold;
    font-size: 22px;
    line-height: 28px;
    color: $white;
  }

  h3 {
    font-size: 18px;
    color: $blue;
    @extend .fw-extraBold;
    line-height: 23px;
    margin-bottom: 30px;
  }

  .mobile-join {
    width: 100%;
    text-align: center;
    font-size: 14px;
    padding: 14px 20px;
    color: $white;
    @extend .fw-semiBold;
    background: #1ebe04;
    border-radius: 100px;

    &:hover,
    &:focus {
      background: #188107;
    }
  }

  .mobile-login {
    width: 100%;
    text-align: center;
    font-size: 14px;
    padding: 14px 20px;
    color: $white;
    @extend .fw-semiBold;
    background: #4667dc;
    border-radius: 100px;
    &:hover,
    &:focus {
      background: #1939a8;
    }
  }
}

// better rewrite
.plan-games-submenu-mobile-bar {
  display: none;
}

@include media-breakpoint-down(md) {
  .plan-games-submenu-mobile-bar {
    display: block;
  }
  .plan-games-submenu-mobile-bar.filters-mobile {
    margin-bottom: 10px;
  }
  .plan-games-submenu-mobile-bar .mobile-filter {
    display: block !important;
    padding-bottom: 0 !important;
    margin-bottom: 10px;
  }

  .plan-games-submenu-mobile-bar .mobile-filter__item {
    width: auto;
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .plan-games-submenu-mobile-bar .mobile-filter__item-text {
    font-size: 16px;
    color: #18191c;
    white-space: nowrap;
  }

  // .plan-games-submenu-mobile-bar .mobile-filter li + li {
  //   height: 50px !important;
  // }

  .plan-games-submenu-mobile-bar
    + .filters-search-bar.filters-mobile.filter-moving
    .container.pt-10.pb-10 {
    display: none;
  }

  .plan-games-submenu-mobile-bar.filter-s .container-mobile-s {
    margin-bottom: 0;
  }

  @media (max-width: 1349.98px) {
    .plan-games-submenu-mobile-bar .mobile-filter ul {
      margin-bottom: 0 !important;
    }
  }

  @media (max-width: 1349.98px) {
    .plan-games-submenu-mobile-bar.filter-s .container-mobile-s {
      padding-bottom: 0 !important;
    }
  }
}

