
:root {
 
    --body-color: #000000;
    --latin-color: #ffffff;
    --header-color: #131212;
    --button1-color: linear-gradient(132deg, #333232 8.37%, #171515 89.17%);
   
    --button2-color: linear-gradient(45deg, #e0900f, #d48e1e, #a46a0c, #f5d197 );
    --menu-color: #131212;
}
   body{  margin:0px;  background: var(--body-color);  color: var(--latin-color);  }  h2,h3,h4,h5,h6{  font-size:inherit;  margin-bottom:10px;  text-align: center;  }    a{  color:inherit;  }    header {  height: 100px;  display: flex;  background: var(--header-color);  background-size: cover;  line-height: 1.3;  align-items: center;  flex-direction: row;    }  .main_logo{  margin-top: 5px;  margin-left: 15px;  }    .main_right-div0{  top: 20px;  position: sticky;    }    .main {  padding: 0px 0px;    line-height: 1.5;    }  .main__slots{  display: flex;  justify-content: space-around;  flex-wrap: wrap;    }      .main__slot {  display: flex;  flex-direction: column;  justify-content: flex-end;  text-align: center;  border-radius: 5px;  height: 187px;  display: flex;  align-items: flex-end;  flex-wrap: nowrap;  background-size: cover!important;  background-position: center!important;  overflow: hidden;  position:relative;  margin-bottom:15px;  }  .main__slot:before {  content: '';  background-image: url(/assets/css/play-solid.svg);  background-size: 50px;  background-repeat: no-repeat;  background-position: center;  font-weight: 900;  position: absolute;  top: 45%;  left: 50%;  padding-top: 50%;  width: 100%;  height: 100%;  transform: translate(-50%, -50%);  font-size: 50px;  color: rgba(255, 255, 255, 0);  background-color: #fff;  opacity: 0;  transition: all 0.3s ease;  }    .main__slot:hover:before {  opacity: 0.9; /* сделать иконку видимой */  color: white; /* белый цвет для иконки */  background-color: #26262691; /* фоновый цвет */  filter: drop-shadow(0px 10px 34px rgba(255, 58, 26, 0.42));    }    .main_slot_title {  filter: drop-shadow(0px 11px 8px rgba(0, 193, 160, 0.11));  background: var(--button1-color);  font-size: 13px;  width: 100%;  padding: 7px 0px;  border-bottom-left-radius: 7px;  border-bottom-right-radius: 7px;    }    img {  width: 100%;  }  .main_right{  width: 250px;  margin-top: -100px;  }    .main_right-div {  border-radius: 10px;  filter: drop-shadow(0 0 34px rgba(48, 46, 43, 0.13));  background: var(--menu-color);  padding: 30px;  width: 100%;  height: 115px;  }  li {  margin-bottom: 5px;    }  .main_right-div2 {  padding: 10px 0;  }  .main_right-div2 .href{  padding: 5px 0;    }    .main_button {  display: flex;  align-items: center;  justify-content: space-between;  width: 310px;  padding-bottom: 30px;      }  /*кнопка вход*/  .main_button .href:first-child {  width: 45%;  height: 55px;  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);  border-radius: 10px;  border: 2px solid hsl(0deg 0% 0% / 10%);  background: var(--button1-color);  display: flex;  font-weight: bold;  transition: .5s;  align-items: center;  justify-content: center;    }  /*кнопка регистрации*/  .main_button .href:last-child {  width: 45%;  height: 55px;  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);  border-radius: 10px;  /*border: 2px solid hsl(0deg 0% 0% / 10%); */  background: var(--button2-color);  display: flex;  font-weight: bold;  /* transition: .5s; */  align-items: center;  justify-content: center;    /* добавляю */  border: none;  background-size: 500% 500%;  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);  transition: transform 0.3s ease;  animation: gradientshift 5s ease infinite;  }    .main_button .href:hover {  transform:scale(1.1);    }    .main_right-div2 div:hover{  border-radius: 5px;  padding: 3px;  background-position: left;  color:#111;  background: #fff;  }    /*таблицы*/  .table-wrapper {  overflow-x: auto;  -webkit-overflow-scrolling: touch;  }      table {  width: 100%;  table-layout: fixed;  border-collapse: collapse;  font-size: 12px;  }      th, td {  word-wrap: break-word;  word-break: break-word;  hyphens: auto;  max-width: 200px;  }      .faq {  width: 100%;  max-width: 100%;  margin: 0 auto;  }    .faq-item {  border: 1px solid #525252;  border-radius: 10px;  margin-bottom: 10px;  overflow: hidden;  }    .faq-question {  background: var(--header-color);  width: 100%;  color: var(--latin-color);  padding: 5px;  cursor: pointer;  font-size: 17px;  font-weight: bold;  border: none;  text-align: left;  }    .faq-answer {  font-size: 16px;  max-height: 0;  overflow: hidden;  transition: max-height 0s ease;  }    .faq-answer.visible {  max-height: 800px; /* достаточно для текста */  padding: 10px;  }      #menu.open {  transform: unset;  height: auto;  }    #menu_close.active {  display: block !important;  z-index: 1000;  }    footer{  height: auto;  background-color: #000;  border-top: 1px solid #a6a6a6;  color: #a6a6a6;  display: flex;  padding: 20px 0px 20px;  flex-direction: column;  display: flex;  align-content: center;  align-items: center;  justify-content: center;  }    h1{  margin-top:35px;  font-size:25px;    text-align: center;  }    .footmenu{  display: flex;  flex-direction: column;  align-items: center;    }    .rules{  margin-top: 20px;  display: flex;  flex-direction: row;  justify-content: center;  align-items: center;    }    /*планшеты и моб */  @media (max-width: 1024px) {  .rules{  display: flex;  flex-direction: column;    }    }    .reviews-section {  display: grid;    grid-template-columns: repeat(auto-fit, minmax(350px, 2fr));  gap: 20px;  max-width: 1000px;  margin: auto;  padding: 20px;  box-sizing: border-box;  }    .review-card {  background: var(--menu-color);  border-radius: 12px;  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);  padding: 20px;  transition: transform 0.3s ease, box-shadow 0.3s ease;  }    .review-card:hover {  transform: translatey(-5px);  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12);  }    .review-name {  margin-top: 0;  margin-bottom: 10px;  font-size: 18px;  font-weight: 600;  color: var(--button2-color);  }    .review-text {  font-size: 16px;  color: #fff;  }  @media (max-width: 768px) {  .reviews-section {  grid-template-columns: 1fr;  }  }    .bonus-banner {  position: relative;  width: 100%;  height: auto;  overflow: hidden;  margin: 0 auto;    }    .banner-content {  position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  display: flex;  justify-content: space-between;  align-items: center;  padding: 20px;  box-sizing: border-box;  }  .banner-text {  display: flex;  flex-direction: column;  justify-content: center;  color: white;  font-size: 20px;  max-width: 50%;  padding: 75px;  font-weight: bold;  align-items: center;  }    .banner-logo {  max-width: 150px;  height: auto;  padding: 75px;  }    @media (max-width: 768px) {  .bonus-banner {  display: flex;  justify-content: center;  }    .banner-logo {  width: 100%;  height: 100%;  object-fit: cover;  object-position: center;  }  .banner-content {  display: flex;  justify-content: center;    }  .banner-text {  display: flex;  gap: 30px;  padding: 0px;  max-width: 100%;  align-items: center;    }  .bonus-banner img{  width: 100%;  height: 400px;  object-fit: cover;  object-position: right;  }  .logo-bonus {  display: none;  }  }  /*кнопка*/  .bonus-btn-glow {  position: relative;  padding: 12px 24px;  font-size: 16px;  font-weight: bold;  color: white;  background: var(--button2-color);  background-size: 300% 300%;  border: none;  border-radius: 8px;  cursor: pointer;  z-index: 0;  overflow: hidden;  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);  transition: transform 0.3s ease;  animation: gradientshift 5s ease infinite;  }    .bonus-btn-glow:hover {  transform: scale(1.05);  }    /* градиентная анимация */  @keyframes gradientshift {  0% {  background-position: 0% 50%;  }  50% {  background-position: 100% 50%;  }  100% {  background-position: 0% 50%;  }  }      /*  ниже не исселдовано*/ /*  ниже не исселдовано*/ /*  ниже не исселдовано*/ /*  ниже не исселдовано*/        @media not all and (max-width:1200px) {  @media screen {  body,  html {  height: auto;  }  }  }                            /* */          .main .main__slot img{  margin:0px;  }          header .main_right-div,.mobile_ {  display:none;  }    .main__fot2{  padding-left:50px;  font-size:14px;  }      .main__fot1{  display: flex;  align-items: center;  }  header .main_container{  flex-direction: column;  align-items: baseline;  padding:60px 0px;  }      .main_container{  width: 1300px;  margin: auto;  display: flex;    }      .imgintext{  max-width: 50%;  height: auto;  border-radius: 10px;    }    a{  text-decoration:none;      }    .main img{  margin: 10px 0px 25px 0px;  }    .my_button {  width: 265px;  height: 66px;  border-radius: 5px;  background-color: #f60522;  color: #fff;  display: flex;  align-items: center;  justify-content: center;  margin: 30px auto;  }        .zagolovok{  margin-top:20px;  font-size:28px;  }      .main_left{  width:980px;  margin-right:20px;  }    .promo{  margin:30px 0px;}    .promo1 {  height: 42px;  margin-bottom:10px;  border-radius: 5px;  background-color: #ffffff;  display: flex;  align-items: center;  justify-content: space-around;  }  .promo1 div{  width: 10px;  height: 10px;  border-radius: 5px;  background-color: #ff3a1a;  }          .ab {  border-radius: 10px;  background: url(data:,) no-repeat;  position: relative;  padding: 27px;  background-size: cover;  margin-top: 50px;  margin-bottom:40px;  margin-left: 40px;  }      strong{  display:block;  margin-top:40px;  font-size: 20px;  }                .main_right-div1{  line-height:1;  font-size: 26px;  color: #ffffff;  }          /* .main_right-div2 div{  padding:7px 0px;  margin-left:-10px;  color:#b1b1b1;  font-size: 15px;  cursor:pointer;  padding-left:10px;  background-position: bottom  } */      img{  /* max-width:100%; */  }      @media screen and (max-width: 1450px) {      .main_button.mobile_{  display:none;  }          header{  font-size:30px;  }    }    /*используется*/  @media screen and (max-width: 1000px) {  .imgintext {  max-width: 100%;  height: auto;  border-radius: 10px;}  }    @media screen and (max-width: 1024px)  {        #main_s2 br{  display:none;  }    .footer img{  display:none;  }        .main_button .href{  height: 40px!important;  font-size: 4vw!important;    }      .main_button.mobile_ {  display: flex;  position: absolute;  z-index: 0;  right: 5vw;  top: 130px;  margin-top: -15px;  width: 90vw;  }        .main_container {  width: 90vw;  margin: auto;  display: flex;  margin-bottom: 1px;  }  .main_right{  display:none;  }    .main_left {  width: auto;  margin-right: 0px;  }    h1 br{  display:none;  }    h1 {  margin-top: 60px;  font-size: 23px;  }      header .main_container {  flex-direction: column;  align-items: baseline;  padding: 10px 0px;  }    .main {  padding: 15px 0px;  font-size: 16px;  line-height: 1.5;  margin-top: 60px;  }        .main__fot2 {  padding-left: 0px;  font-size: 14px;  line-height: 1.4;  padding: 30px 0px;  }  footer {  height: auto;  }  body,html{  position: relative;  overflow-x:hidden;  height: 100%;  }          header .main_right-div {  position: absolute;  right: 0px;  top: 0px;  margin-top: 0px;  width: 100vw;  display:block;  transition:.3s;  box-sizing: border-box;  transform: translatex(150%);  z-index: 10;  }  .main_right-div2 {  margin: 10px 0px;  font-style: normal;  text-transform: none;  }  header .main_right-div.acriv {  transform: translatex(0%);  height: 450px;  background-repeat: round;  z-index: 2;    }  .mobile_ {  display: block;  position: absolute;  z-index: 10;  right: 25px;    }  .close {  display:none;  }  }  .promo1 {  position:relative;  border: #ff3a1a 2px solid;  padding: 20px;  width: 350px;  max-width: 100%;    }          body, html {    -webkit-overflow-scrolling: touch; /* для поддержки ios */  font-family: 'poppins', sans-serif;    }    /* медиа-запрос для экранов, если ширина меньше или равна 1000px */  @media not all and (max-width: 1000px) {  body, html {  height: auto;  }  }
   


.last-update {
    text-align: right;
    font-size: 14px;
    color: #777;
    margin-top: 40px;
    font-style: italic;
}



  .marquee-container {
    position: fixed;
    bottom: 0;
    width: 100%;
    background: var(--button2-color);
    color: white;
    font-weight: bold;
    font-size: 18px;
    overflow: hidden;
    z-index: 9999;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
  }

  .marquee-text-wrapper {
    flex: 1;
    overflow: hidden;
  }

  .marquee-text {
    white-space: nowrap;
    display: inline-block;
    animation: marquee 10s linear infinite;
    padding-left: 100%;
  }

  @keyframes marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-100%); }
  }

  .bonus-button {
    background-color: white;
    color: black;
    border: none;
    padding: 10px 16px;
    border-radius: 6px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s;
  }

  .bonus-button:hover {
    background-color: #ffe0b3;
  }
