/* Resizes */
/* Colors */
.popup {
  -webkit-overflow-scrolling: touch;
  z-index: 100;
  padding: 30px 10px;
  position: fixed;
  top: 0px;
  left: 0;
  width: 100%;
  height: 100%;
  transition: visibility 0.8s ease 0s;
  visibility: hidden;
  z-index: 999;
  display: none;
}

@media (max-width: 767px) {
  .popup {
    padding: 0;
  }
}
.popup::before {
  content: "";
  background: rgba(0, 0, 0, 0.1);
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.8s ease 0s;
}

.popup.show {
  visibility: visible;
  overflow: auto;
}

.popup.show::before {
  opacity: 1;
}

.popup.show .popup__body {
  transform: scale(1);
}

.popup._active {
  overflow: auto;
  visibility: visible;
  display: block;
}

.popup._active::before {
  opacity: 1;
}

.popup._active .popup__body {
  transition: all 0.3s ease 0.2s;
  transform: scale(1);
}

.popup__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 100%;
  flex: 1 1 auto;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16px;
}

.popup__content.popup-search {
  justify-content: flex-start;
  margin-top: 90px;
  position: fixed;
  left: 0;
}

@media (max-width: 1352px) {
  .popup__content.popup-search {
    margin-top: calc(54px + 36 * (100vw - 360px) / 992);
  }
}
.popup__body {
  transform: scale(0);
  transition: all 0.3s ease 0s;
  background-color: #121316;
  padding: 60px 20px 30px 20px;
  width: 100%;
  max-width: 900px;
  border-radius: 16px;
  position: relative;
}

@media (max-width: 767px) {
  .popup__body {
    padding: 40px 15px 20px 15px;
  }
}
.popup__close {
  width: 20px;
  height: 20px;
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
  z-index: 30;
  background: none;
  transition: all 0.5s ease 0s;
}

@media (max-width: 767px) {
  .popup__close {
    top: 15px;
    right: 15px;
  }
}
.popup-game__iframe {
  height: 100%;
  height: 600px;
}

@media (max-width: 767px) {
  .popup-game__iframe {
    height: 100%;
  }
}
.popup-game__body iframe {
  width: 100%;
  height: 500px;
}

.home-top {
  margin: 32px 0 0 0;
}
@media (max-width: 1200px) {
  .home-top__body {
    overflow-y: auto;
  }
}
.home-top__casinos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(308px, 1fr));
  -moz-column-gap: 32px;
       column-gap: 32px;
}
@media (max-width: 1200px) {
  .home-top__casinos {
    display: flex;
    -moz-column-gap: 18px;
         column-gap: 18px;
    justify-content: space-between;
  }
}
.home-top__casino {
  border-radius: 16px;
  background-color: #1b1d21;
  padding: 0 0 22px 0;
  border: 1px solid transparent;
  transition: all 0.3s ease 0s;
  display: flex;
  flex-direction: column;
}
.home-top__casino:hover {
  border-color: #7113FF;
}
@media (max-width: 1200px) {
  .home-top__casino {
    width: 308px;
    min-width: 308px;
  }
}
.home-top__head {
  background-color: #2a2e36;
  border-radius: 16px 16px 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 3px 10px 0 10px;
}
.home-top__col-01 {
  display: flex;
  align-items: center;
}
@media (max-width: 1200px) {
  .home-top__col-01 img {
    width: 32px;
    height: 32px;
    -o-object-fit: contain;
       object-fit: contain;
  }
}
.home-top__cup-label {
  color: #FFCF05;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
  margin-left: 8px;
}
@media (max-width: 1200px) {
  .home-top__cup-label {
    font-size: 12px;
  }
}
.home-top__col-02 {
  display: flex;
  align-items: center;
  -moz-column-gap: 8px;
       column-gap: 8px;
}
.home-top__col-02 .rating {
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
}
.home-top__poster {
  display: flex;
  height: 130px;
  border-radius: 0 0 16px 16px;
}
.home-top__poster picture {
  width: 100%;
}
.home-top__poster img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0 0 16px 16px;
}
.home-top__name {
  margin: 18px 0 22px 0;
}
.home-top__title {
  color: #99A0AA;
  font-size: 22px;
  font-weight: 700;
  text-align: center;
}
.home-top__text {
  max-width: 375px;
  color: #E7EAEE;
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.512px;
  margin: 16px auto 0 auto;
}
@media (max-width: 1200px) {
  .home-top__text {
    font-size: 20px;
    padding: 0 16px;
  }
}
.home-top__info {
  margin-top: auto;
  background-color: #0F1113;
  padding: 22px 0;
  display: grid;
  grid-template-columns: minmax(auto, 50%) minmax(auto, 50%);
}
.home-top__col-03 {
  grid-column-start: 1;
  grid-row-start: 1;
  display: flex;
  flex-direction: column;
  padding-right: 22px;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  border-right: 1px solid #23262C;
}
@media (max-width: 767px) {
  .home-top__col-03 {
    padding-right: 10px;
  }
}
.home-top__label {
  color: #E8E8E8;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  text-align: center;
  margin-bottom: 20px;
}
.home-top__mean {
  color: #FFCF05;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  text-align: center;
}
.home-top__col-04 {
  grid-column-start: 2;
  grid-row-start: 1;
  display: flex;
  flex-direction: column;
  padding-left: 22px;
  width: -moz-fit-content;
  width: fit-content;
  margin-right: auto;
}
@media (max-width: 767px) {
  .home-top__col-04 {
    padding-left: 10px;
  }
}
.home-top__col-05 {
  grid-column-start: span 2;
  grid-row-start: 2;
  margin-top: 22px;
  display: flex;
  -moz-column-gap: 8px;
       column-gap: 8px;
  padding: 0 38px;
}
.home-top__col-05 img {
  width: 50px;
  height: 28px;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 4px;
}
@media (max-width: 1200px) {
  .home-top__col-05 img {
    width: 32px;
    height: 21px;
  }
}
.home-top__col-05 .counter {
  width: 50px;
  height: 28px;
  text-align: center;
  font-family: "Montserrat", sans-serif;
  font-size: 14px;
  font-size: 14px;
  line-height: 16px;
  color: #E7EAEE;
  border: 1px solid #E7EAEE;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 1352px) {
  .home-top__col-05 .counter {
    font-size: calc(12px + 2 * (100vw - 360px) / 992);
  }
}
@media (max-width: 1200px) {
  .home-top__col-05 .counter {
    width: 32px;
    height: 21px;
  }
}
.home-top__buttons {
  margin-top: auto;
  padding: 22px 22px 0 22px;
  display: flex;
  flex-direction: column;
}
@media (max-width: 1200px) {
  .home-top__buttons {
    padding: 15px 16px;
  }
}
.home-top__link-casino {
  border-radius: 12px;
  background: linear-gradient(91deg, #7113FF -3.33%, #A80EFF 110.01%);
  padding: 16px 17px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.home-top__link-casino span {
  color: #E7EAEE;
  text-align: center;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
}
.home-top__link-main {
  margin-top: 13px;
  width: 100%;
  padding: 8px 17px;
  border-radius: 12px;
  text-align: center;
  color: #E7EAEE;
  text-align: center;
  font-size: 18px;
}

.popup-casinos__title {
  text-align: center;
  font-size: 24px;
}
.popup-casinos__text {
  margin: 20px 0 0 0;
  text-align: center;
}
.popup-casinos__items {
  margin: 40px 0 0 0;
  display: flex;
  gap: 16px;
}
.popup-casinos__items .home-top__casino {
  width: 33.3333%;
}
@media (max-width: 767px) {
  .popup-casinos__items {
    flex-direction: column;
  }
  .popup-casinos__items .home-top__casino {
    width: 100%;
  }
}/*# sourceMappingURL=popup.css.map */